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

Feat: Added Jigsaw Puzzle Game #4677

Merged
merged 5 commits into from
Jul 6, 2024
Merged

Feat: Added Jigsaw Puzzle Game #4677

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
b8ec286
Added Jigsaw Puzzle Game
shreyash3087 Jun 23, 2024
328db4c
Updated README.md
shreyash3087 Jul 4, 2024
f3ded9c
Merge branch 'main' into add/jigsaw-puzzle
shreyash3087 Jul 4, 2024
ae82d34
Merge branch 'main' into add/jigsaw-puzzle
shreyash3087 Jul 5, 2024
51bd3aa
Merge branch 'main' into add/jigsaw-puzzle
shreyash3087 Jul 6, 2024
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
35 changes: 35 additions & 0 deletions Games/Jigsaw_Puzzle/Readme.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
# Classic Jigsaw Puzzle Game

Welcome to the Classic Jigsaw Puzzle Game! This game allows you to upload any image and transform it into a jigsaw puzzle with varying difficulty levels. Whether you're looking for a quick challenge or a more intricate puzzle to solve, this game provides an enjoyable and interactive experience.

## Game Features

- **Image Upload:** Upload your own images to create personalized puzzles.
- **Piece Selection:** Choose from 12, 25, 50, 100, or 200 pieces for different difficulty levels.
- **Interactive Gameplay:** Drag and drop pieces to solve the puzzle.
- **User-Friendly Interface:** Designed for a smooth and enjoyable user experience.
- **Responsive Design:** Compatible with different devices, ensuring a great experience on both desktop and mobile.

## Rules

1. **Objective:** The goal is to assemble the puzzle pieces to form the complete image.
2. **Piece Selection:** Select the number of pieces you want for your puzzle. The more pieces, the more challenging the puzzle.
3. **Gameplay:** Drag and drop the pieces to their correct positions. Pieces will snap into place when they are correctly aligned.

## How to Play

1. **Upload Image:** Click on the "Upload Image" button to select an image from your device.
2. **Select Pieces:** Choose the number of pieces for your puzzle (12, 25, 50, 100, 200).
3. **Start Puzzle:** The image will be broken into pieces, and you can start solving the puzzle by dragging and dropping the pieces.
4. **Solving:** Arrange the pieces to form the complete image. Pieces will snap into place when correctly positioned.
5. **Complete Puzzle:** Once all pieces are correctly placed, the puzzle is complete, and you can admire your work!

## Screenshot

![image](/assets/images/Jigsaw_Puzzle_SS.png)

## Enjoy the Game!

We hope you have fun playing the Classic Jigsaw Puzzle Game. If you have any feedback or suggestions, feel free to share them with us. Happy puzzling!


29 changes: 29 additions & 0 deletions Games/Jigsaw_Puzzle/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id=forPuzzle></div>
<ul id="menu">
<li>&#x2630;</li>
<li>default image</li>
<li>load image</li>
<li>shape: <select id="shape">
<option value="1" selected>classic</option>
<option value="2">triangle</option>
<option value="3">round</option>
<option value="4">straight</option>
</select></li>
<li>12 pieces</li>
<li>25 pieces</li>
<li>50 pieces</li>
<li>100 pieces</li>
<li>200 pieces</li>
</ul>
<script src="script.js"></script>
</body>
</html>
Loading
Loading