Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Puzzel_Winner #2934

Merged
merged 3 commits into from
Oct 3, 2023
Merged

Puzzel_Winner #2934

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
636325c
Puzzel_Winner
Durgesh4993 Oct 2, 2023
aa4f691
update
Durgesh4993 Oct 2, 2023
800f32f
Update
Durgesh4993 Oct 2, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 27 additions & 0 deletions Games/Puzzel_winner/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
# **Game_Name**
Puzzel Winer
---

<br>

## **Description 📃**
In this game you can upload you image and play puzzle


<br>

## **Screenshots 📸**
![image](https://github.com/kunjgit/GameZone/assets/98798977/5012ff8b-b3dd-476e-a0db-71468106b35b)


<br>
<!-- add your screenshots like this -->
<!-- ![image](url) -->

<br>

## **Working video 📹**
<!-- add your working video over here -->

https://github.com/kunjgit/GameZone/assets/98798977/2bc67ea6-9b93-4135-bed5-8297b417d4ff

Binary file added Games/Puzzel_winner/art.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
38 changes: 38 additions & 0 deletions Games/Puzzel_winner/example.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
<!DOCTYPE html>
<html>
<head>
<style>
body {
height: 97vh;
padding: 0;
display: grid;
align-content: center;
justify-content: center;
}
</style>
</head>
<body>
<div id='fifteen'></div> <!--element "fifteen" in which the game will take place-->
<script>
var setup={
puzzle_fifteen:{
diff:300, // number of movements of the slots for shuffling pictures
size:[512,640], // element size "fifteen" in pixels only
grid:[3,4], // the number of squares in the height and width of the picture
fill:true, // Stretching the area with the game to fit the element is recommended for fullscreen
number:false, // Slot sequence number
gamePad:true,
art:{
url:"art.jpg", // path to the picture (you can use any format of supported browsers, gif-animation of svg)
ratio:false // enlarge the picture in height or width
},
// optional elements
time:0.1, // block move animation time
style:"border-radius:12px;", // style for puzzle square
keyBoard:true // Control using the keys on the keyboard
}
}
</script>
<script src="fifteen_puzzle.js"></script> <!--path to file engine-->
</body>
</html>
115 changes: 115 additions & 0 deletions Games/Puzzel_winner/fifteen_puzzle.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,115 @@
var p=setup.puzzle_fifteen,freeslot=[],size=[],m=[],o,f=document.getElementById("fifteen");
ceation_slots();
function ceation_slots(){
size=[p.size[0]/(p.grid[0]+1),p.size[1]/(p.grid[1]+1)]
var c=(p.emptySlot)?p.emptySlot:(p.grid[1]+1)*(p.grid[0]+1);
f.style.width=p.size[0]+'px';
f.style.height=p.size[1]+'px';
f.style.position='relative';
if(p.fill){fifteen_resize();window.addEventListener('resize',fifteen_resize,true);}
o=1;
for(var y=0;y<=p.grid[1];y++){
for(var x=0;x<=p.grid[0];x++){
if(o!=c){
if(!m[y]){m[y]=[]};m[y][x]=o;
var e=document.createElement("div");
e.id="slot"+o;
e.setAttribute("onclick","move_slot("+o+")");
e.className="slot";
if(p.number){e.innerHTML=o}
e.style="background-image:url("+p.art.url+");background-size:"+((p.art.ratio)? p.size[0]+"px auto":"auto "+p.size[1]+"px")+";background-position:-"+(size[0]*x)+"px -"+(size[1]*y)+"px ;width:"+size[0]+"px;height:"+size[1]+"px;top:"+(size[1]*y)+"px;left:"+(size[0]*x)+"px;position:absolute;"+((p.style)?p.style:"")
if(p.time){e.style.transitionDuration=p.time+"s"}
f.appendChild(e);o++;
}else{m[y][x]=0;freeslot=[y,x];o++;}
}
}stir_slots();
}
function stir_slots(){
for(var y=0;y<p.diff;y++){
var a=[];
if((Math.random()*2)>1){
a=[freeslot[0]+(-1+Math.round(Math.random()*2)),freeslot[1]];
if(a[0]<0){a[0]=a[0]+2}else if(a[0]>p.grid[1]){a[0]=a[0]-2}
}else{
a=[freeslot[0],freeslot[1]+(-1+Math.round(Math.random()*2))];
if(a[1]<0){a[1]=a[1]+2}else if(a[1]>p.grid[0]){a[1]=a[1]-2}
}
var s=[m[freeslot[0]][freeslot[1]],m[a[0]][a[1]]]
m[freeslot[0]][freeslot[1]]=s[1];m[a[0]][a[1]]=s[0]
freeslot=[a[0],a[1]]
}
for(var y=0;y<=p.grid[1];y++){
for(var x=0;x<=p.grid[0];x++){
if(m[y][x]){
var e=document.getElementById("slot"+m[y][x])
e.style.left=(x*size[0])+"px";
e.style.top =(y*size[1])+"px";
}
}
}
}
function move_slot(s) {
var z=0,e,a=[],k,j;
function move(y,x,h,w){
j=m[y][x]
e=document.getElementById("slot"+j);
e.style.left=((x+w)*size[0])+"px";
e.style.top =((y+h)*size[1])+"px";
m[y][x]=k;k=j;
}
for(var y=0;y<p.grid[1]+1;y++){
for(var x=0;x<p.grid[0]+1;x++){
if(m[y][x]==s){
a=[y,x];k=0;
if(freeslot[0]==a[0]){
if(freeslot[1]>a[1]){for(z=0;z<freeslot[1]-a[1];z++){move(a[0],a[1]+z,0,+1)}}
else if(freeslot[1]<a[1]){for(z=0;z<a[1]-freeslot[1];z++){move(a[0],a[1]-z,0,-1)}}
m[freeslot[0]][freeslot[1]]=k;freeslot=[a[0],a[1]];s=false;break;
}else if(freeslot[1]==a[1]){
if(freeslot[0]>a[0]){for(z=0;z<freeslot[0]-a[0];z++){ move(a[0]+z,a[1],+1,0)}}
else if(freeslot[0]<a[0]){for(z=0;z<a[0]-freeslot[0];z++){move(a[0]-z,a[1],-1,0)}}
m[freeslot[0]][freeslot[1]]=k;freeslot=[a[0],a[1]];s=false;break;
}
}if(!s){break;}
}if(!s){break;}
}check_slots();
}
function check_slots(){
var check=1;
for(var y=0;y<=p.grid[1];y++){
for(var x=0;x<=p.grid[0];x++){
if(m[y][x]==0||check==m[y][x]){check++}else{break;}
}
}if(check==o){setTimeout(()=>{ alert('win') },((p.time)?p.time*1000:0));} // <-- alert('win') script that runs at the end of the game
}
function fifteen_resize(){
var rect=f.parentNode.getBoundingClientRect();
if((p.size[0]/p.size[1])<(rect.width/rect.height)){f.style.transform='scale('+(rect.height/p.size[1])+')'}
else{f.style.transform='scale('+(rect.width/p.size[0])+')'}
}
if(p.keyBoard){document.addEventListener("keydown",function(e){
e=e.keyCode;
if(e==37){move_slot(m[freeslot[0]][freeslot[1]+1]);}
else if(e==39){move_slot(m[freeslot[0]][freeslot[1]-1]);}
else if(e==38){move_slot(m[freeslot[0]+1][freeslot[1]]);}
else if(e==40){move_slot(m[freeslot[0]-1][freeslot[1]]);}
})}
let gamepad,gamepadPress;
if(p.gamePad){window.addEventListener('gamepadconnected',function(e){
const update=()=>{
for (gamepad of navigator.getGamepads()){
if (!gamepad) continue;
const statenow=gamepad.buttons.some(btn=>btn.pressed);
if (gamepadPress!==statenow){
gamepadPress=statenow;
if(gamepad.buttons[12].pressed&&m[freeslot[0]+1]){move_slot(m[freeslot[0]+1][freeslot[1]]);}
else if(gamepad.buttons[14].pressed&&m[freeslot[0]]) {move_slot(m[freeslot[0]][freeslot[1]+1]);}
else if(gamepad.buttons[15].pressed&&m[freeslot[0]]) {move_slot(m[freeslot[0]][freeslot[1]-1]);}
else if(gamepad.buttons[13].pressed&&m[freeslot[0]-1]){move_slot(m[freeslot[0]-1][freeslot[1]]);}
}
}
requestAnimationFrame(update);
};update();
});
}

Binary file added Games/Puzzel_winner/icon.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Loading