PetPet all tigers images and new logo

This commit is contained in:
2024-08-16 20:50:42 +02:00
parent cee37b3d61
commit ff2f9ddc29
10 changed files with 45 additions and 24 deletions

View File

@@ -10,11 +10,13 @@
</head>
<body>
<h1 id="opponent-score">0</h1>
<article class="choiBACK">
<img src="Invis.png" class="choices" id="opponent-choice" draggable="false">
<img src="Invis.png" class="choices" id="your-choice" draggable="false">
</article>
<div id="choices" draggable="false"></div>
<section>
<article class="choiBACK">
<img src="Invis.png" class="choices" id="opponent-choice" draggable="false">
<img src="Invis.png" class="choices" id="your-choice" draggable="false">
</article>
<div id="choices" draggable="false"></div>
</section>
<h1 id="your-score">0</h1>
</body>
</html>

View File

@@ -11,6 +11,7 @@ window.onload = () => {
let choice = document.createElement("img");
choice.id = choices[i];
choice.src = `${choices[i]}.png`;
choice.setAttribute("draggable", "false");
choice.addEventListener("click", selectChoice);
document.getElementById("choices").append(choice);
}

View File

@@ -39,12 +39,22 @@ h1{
/*background: #4fdc5e;*/
margin-top: 20px;
}
section{
backdrop-filter: blur(5px);
border-radius: 50px;
box-shadow:
inset 10px 10px 20px #fff,
10px 10px 20px #333;
}
#choices{
width: 240px;
height: 80px;
width: 304px;
height: 90px;
/*background: #f4a478;*/
border-top: 2.5px #000000cc solid;
margin: 0 auto;
margin-top: 10px;
border-radius: 30px;
display: flex;
justify-content: space-around;
}
#choices img{
@@ -56,11 +66,6 @@ h1{
padding: 2rem;
display: flex;
flex-direction: column;
backdrop-filter: blur(5px);
border-radius: 50px;
box-shadow:
inset 10px 10px 20px #fff,
10px 10px 20px #333;
}
.choices{
@@ -69,6 +74,15 @@ h1{
border-radius: 25px;
}
@keyframes pop{
0%{
transform: scale(0.5);
}
100%{
transform: scale(1);
}
}
@media screen and (max-width: 500px){
body{
background-image: url("./mobile.jpg");
@@ -77,7 +91,4 @@ h1{
width: 180px;
height: 180px;
}
.choiBACK{
}
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 144 KiB

After

Width:  |  Height:  |  Size: 295 KiB

BIN
img/gone/Invis.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 120 B

BIN
img/gone/tiger.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 738 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 203 KiB

After

Width:  |  Height:  |  Size: 294 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 155 KiB

After

Width:  |  Height:  |  Size: 561 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 526 KiB

23
main.js
View File

@@ -20,7 +20,8 @@ const imgTiger = {
////Summer: {},
////Fall: {},
////Winter: {},
Dead: './img/dead/tiger.png'
Dead: './img/dead/tiger.png',
Gone: './img/gone/tiger.png'
}
let attributes = {
@@ -99,29 +100,36 @@ function display(){
Dhealth.innerHTML = toCPercen(attributes.Hp);
if(attributes.Age.value<=6){
NameC.innerHTML = `Junior`
NameC.innerHTML = `Junior`;
Aimg.src = imgTiger.Normal.tiger[0];
}else if(attributes.Age.value<18){
NameC.innerHTML = `Teen`
NameC.innerHTML = `Teen`;
Aimg.src = imgTiger.Normal.tiger[1];
}else if(attributes.Age.value<60){
NameC.innerHTML = `Adult`
NameC.innerHTML = `Adult`;
Aimg.src = imgTiger.Normal.tiger[2];
}else if(attributes.Age.value<100){
NameC.innerHTML = `Senior`
NameC.innerHTML = `Senior`;
Aimg.src = imgTiger.Normal.tiger[3];
}else{
NameC.innerHTML = `Dead`
NameC.innerHTML = `Dead`;
attributes.Life.dead = 1;
btnHide();
Aimg.src = imgTiger.Dead;
}
if(attributes.Hp.value<=0){
NameC.innerHTML = `Dead`;
attributes.Life.dead = 1;
btnHide();
Aimg.src = imgTiger.Dead;
}
if(attributes.Life.away){
NameC.innerHTML = `Gone`;
btnHide();
Aimg.src = imgTiger.Gone;
}
}
function play(){
@@ -173,10 +181,9 @@ function btnHide(){
}
function sadDetection(){
if(attributes.Joy.value <= attributes.Joy.abszero){
if((attributes.Joy.value <= attributes.Joy.abszero)&&(attributes.Joy.value<0)){
if(Math.abs(attributes.Joy.value) >= Math.floor(Math.random()*100)){
attributes.Life.away = 1;
btnHide();
}
}
}