Add files via upload

Abdurahmanm2020 · Mar 2, 2020 · b658088 · b658088
commit b658088
Show file tree

Hide file tree

Showing 34 changed files with 512 additions and 0 deletions.
diff --git a/3d-dice.png b/3d-dice.png
diff --git a/background-2.png b/background-2.png
diff --git a/background.png b/background.png
diff --git a/dice1.png b/dice1.png
diff --git a/dice2.png b/dice2.png
diff --git a/dice3.png b/dice3.png
diff --git a/dice4.png b/dice4.png
diff --git a/dice5.png b/dice5.png
diff --git a/dice6.png b/dice6.png
diff --git a/dicee-2-css.css b/dicee-2-css.css
@@ -0,0 +1,88 @@
+
+.background {
+
+}
+
+
+.container {
+  width: 70%;
+  margin: auto;
+  text-align: center;
+}
+
+.dicee {
+	size: 127%;
+  text-align: center;
+  display: inline-block;
+
+}
+
+body {
+	color:#FFF;
+	background-image:url(../images/background-2.png);
+	text-align:center;
+	/*background-color:#C0C0C0;*/
+}
+
+h1 {
+  margin: 30px;
+  font-family: 'Berlin Sans FB', cursive;
+  text-shadow: 4px 0 #00E8E8;
+ font-size: 5rem;
+  color:#AEFFFF;
+}
+
+p {
+  font-size: 2rem;
+  color: #80FFFF;
+  font-family: 'Calibri', cursive;
+}
+
+img {
+	text-shadow: 7px 0 #000;
+  width: 80%;
+}
+
+.role{
+	color:#004080;
+	background-color:#AEFFFF;
+	padding: 0% 0% 0%;
+	font-family: 'Century Gothic' ;
+	font-size: 3rem;
+	border:none;
+	width: 8%;
+	height:10%;
+}
+
+.back{
+	border:none;
+	background-color:#0000EA;
+	color:#80FFFF;
+	color:#9DFFB6;
+	font-size: 2rem;
+	float:left;
+}
+
+.back:hover{
+	color:#004080;
+	background-color:#AEFFFF;
+
+}
+
+
+
+.role:hover{
+	background-color:#0000EA;
+	color:#80FFFF;
+	width: 25%;
+	height:15%;
+
+}
+
+footer {
+  margin-top: 5%;
+  color: #000;
+  text-align: center;
+  font-family: 'Indie Flower', cursive;
+
+}
diff --git a/dicee-2-java.js b/dicee-2-java.js
@@ -0,0 +1,24 @@
+// JavaScript Document
+var randomNumber1 = Math.floor(Math.random() * 6) + 1;
+
+var randomDiceImage = "images/dicee" + randomNumber1 + ".png";
+
+var image1 = document.querySelectorAll("img")[0];
+
+image1.setAttribute("src", randomDiceImage);
+
+var randomNumber2 = Math.floor(Math.random() * 6) + 1;
+
+var randomDiceImage = "images/dicee" + randomNumber2 + ".png";
+
+var image1 = document.querySelectorAll("img")[1];
+
+image1.setAttribute("src", randomDiceImage);
+
+if (randomNumber1 > randomNumber2) {
+   document.querySelectorAll("h1")[0].innerHTML = ("Player 1 WINS!!!");
+} else if (randomNumber2 > randomNumber1) {
+   document.querySelectorAll("h1")[0].innerHTML = ("Player 2 WINS!!!");
+} else if (randomNumber2 === randomNumber1){
+  document.querySelectorAll("h1")[0].innerHTML = ("Draw Ž");
+};
diff --git a/dicee-2.html b/dicee-2.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<title>Dice to rule</title>
+<link rel="stylesheet" type="text/css" href="css/dicee-2-css.css">
+<link rel="icon" href="images/favicon.ico">
+</head>
+
+<body>
+ <a href="start-page.html"><input type="submit" class="back" number="" value="Menu!!!"></a>
+
+   <a href=""><input type="submit" class="role" number="" value="roll now"></a>
+
+    <div class="container">
+      <h1>Refresh Me</h1>
+
+      <div class="dicee">
+        <p>Player 1</p>
+        <img class="img1" src="">
+      </div>
+
+      <div class="dicee">
+        <p>Player 2</p>
+        <img class="img2" src="">
+      </div>
+
+    </div>
+
+
+  </body>
+
+  <footer>
+    www 🎲 Dice to rule 🎲 com...
+  </footer>
+</body>
+<script src="java/dicee-2-java.js" charset ="utf-8"> </script>
+</html>
diff --git a/dicee.html b/dicee.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+  <head>
+    <meta charset="utf-8">
+    <title>Dice to rule</title>
+    <link rel="stylesheet" href="css/styles.css">
+    <link rel="icon" href="images/favicon.ico">
+    <link href="https://fonts.googleapis.com/css?family=Indie+Flower|Lobster" rel="stylesheet">
+
+  </head>
+  <body>
+  <a href="start-page.html"><input type="submit" class="back" number="" value="Menu!!!"></a>
+
+
+
+<a href=""><input type="submit" class="role" number="" value="roll!"></a>
+
+    <div class="container">
+      <h1>Refresh Me</h1>
+
+      <div class="dice">
+        <p>
+    <input type="text" id="lname" name="lastname" placeholder="Player 1.."></p>
+    <!--<p>Player 1</p>-->
+        <img class="img1" src="">
+      </div>
+
+      <div class="dice">
+        <p>
+    <input type="text" id="lname" name="lastname" placeholder="Player 2.."></p>
+    <!--<p>Player 2</p>-->
+        <img class="img2" src="">
+      </div>
+
+    </div>
+
+
+  </body>
+
+  <footer>
+    www 🎲 Dice to rule 🎲 com...
+  </footer>
+
+   <script src="java/index.js" charset ="utf-8"> </script>
+
+</html>
diff --git a/dicee1.png b/dicee1.png
diff --git a/dicee2.png b/dicee2.png
diff --git a/dicee3.png b/dicee3.png
diff --git a/dicee4.png b/dicee4.png
diff --git a/dicee5.png b/dicee5.png
diff --git a/dicee6.png b/dicee6.png
diff --git a/favicon.ico b/favicon.ico
diff --git a/flat-dice.png b/flat-dice.png
diff --git a/game-start-page-2.png b/game-start-page-2.png
diff --git a/how-to-play-btn-2.gif b/how-to-play-btn-2.gif
diff --git a/how-to-play-css.css b/how-to-play-css.css
@@ -0,0 +1,34 @@
+.body {
+	text-decoration:none;
+	text-align:center;
+	background-color:#00C400;
+}
+
+h1 {
+	font-family:'Berlin Sans FB';
+		color:#003700;
+	font-size: 5rem;
+}
+
+p{
+	font-family:'Berlin Sans FB';
+	color: #006400;
+	font-size:3rem;
+}
+
+.back{
+	color:#D9FFD9;
+	border:none;
+	background-color:#003700;
+	font-size: 2rem;
+	width: 15%;
+	float:left;
+	left: 50%;
+}
+
+.back:hover{
+	border:#FFF;
+	color:#fff;
+	background-color:#0A0;
+
+}
diff --git a/how-to-play.html b/how-to-play.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<title>how to play Dice to rule</title>
+<link rel="stylesheet" type="text/css" href="css/how-to-play-css.css">
+<link rel="icon" href="images/favicon.ico">
+</head>
+
+<body class="body">
+
+ <a href="start-page.html"><input type="submit" class="back" number="" value="Menu!!!"></a>
+
+<h1>how to play</h1>
+
+ <p>  the way you play the game is not hard. you choose if you want to be player1 or 2 then click "roll now" and the player with the larger number on the dice is the winner</p>
+</body>
+</html>
diff --git a/index.js b/index.js
@@ -0,0 +1,35 @@
+// JavaScript Document
+/*var filename = "images/player1.png";*/
+
+var randomNumber1 = Math.floor(Math.random() * 6) + 1;
+
+var randomDiceImage = "images/dice" + randomNumber1 + ".png";
+
+var image1 = document.querySelectorAll("img")[0];
+
+image1.setAttribute("src", randomDiceImage);
+
+var randomNumber2 = Math.floor(Math.random() * 6) + 1;
+
+var randomDiceImage = "images/dice" + randomNumber2 + ".png";
+
+var image1 = document.querySelectorAll("img")[1];
+
+image1.setAttribute("src", randomDiceImage);
+/*
+document.querySelectorAll("h1")[0].innerHTML = "<img src='" + filename + "'>";*/
+
+if (randomNumber1 > randomNumber2) {
+
+document.querySelectorAll("h1")[0].innerHTML = ("Player 1 WINS!🚩");
+
+/* document.querySelectorAll("h1")[0].innerHTML = document.getElementById("lname");*/
+} else if (randomNumber2 > randomNumber1) {
+   document.querySelectorAll("h1")[0].innerHTML = ("Player 2 WINS!🚩");
+} else if (randomNumber2 === randomNumber1){
+  document.querySelectorAll("h1")[0].innerHTML = ("Draw 🎌");
+};
+
+
+
+/*document.querySelectorAll.getElimentByid("lname")[0].innerHTML*/
diff --git a/opion-btn-2.gif b/opion-btn-2.gif
diff --git a/opions-css.css b/opions-css.css
@@ -0,0 +1,54 @@
+@charset "utf-8";
+/* CSS Document */
+.body{
+	text-align:center;
+	background-color:#00C400;
+}
+
+
+
+
+
+
+.choos{
+	margin:5% 7% 2%;
+	width: 25%;
+}
+
+.choos2{
+	margin:5% 7% 2%;
+	width: 25%;
+}
+
+h1 {
+	color:#003700;
+	font-family:'Berlin Sans FB';
+	padding: 7% 0% 0% ;
+	text-align:center;
+	font-size: 4rem;
+}
+
+.back{
+	color:#D9FFD9;
+	border:none;
+	background-color:#003700;
+	font-size: 2rem;
+	width: 15%;
+	float:left;
+	left: 50%;
+}
+
+.back:hover{
+	border:#FFF;
+	color:#fff;
+	background-color:#0A0;
+
+}
+
+
+p{
+	color: #006400;
+	font-family:'Berlin Sans FB';
+	text-align:center;
+	font-size: 2rem;
+}
diff --git a/opions.html b/opions.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<title>Dice to rule</title>
+<link rel="stylesheet" href="css/opions-css.css">
+<link rel="icon" href="images/favicon.ico">
+</head>
+
+<body class="body">
+ <a href="start-page.html"><input type="submit" class="back" number="" value="Menu!!!"></a>
+<h1>choose a dice </h1>
+
+<p>click on the dice you want to play with</p>
+
+<a href="dicee.html"><img class="choos" src="images/3d-dice.png"/></a>
+<a href="dicee-2.html"><img class="choos2" src="images/flat-dice.png"/></a>
+</body>
+</html>