diff --git a/Games/Fidget_Spinner_Game/README.md b/Games/Fidget_Spinner_Game/README.md new file mode 100644 index 0000000000..7f6afc0085 --- /dev/null +++ b/Games/Fidget_Spinner_Game/README.md @@ -0,0 +1,37 @@ +# Fidget Spinner + +A fidget spinner made in JavaScript. + +## Description 📃 + + Fidget Spinner is an interactive online simulation of a physical fidget spinner. This digital version allows users to experience the satisfying and stress-relieving sensation of spinning a fidget spinner directly from their browser. + +## Functionalities 🎮 + +- **Interactive Spinning**: Users can spin the fidget spinner by dragging the mouse across the screen. +- **Speed Display**: The current speed of the spinner is displayed, giving users real-time feedback. +- **Custom Speed Setting**: Users can set a custom speed for the fidget spinner, allowing for a personalized experience. +- **Automatic Spin**: For those who prefer not to drag their mouse, a button is available to automatically spin the fidget spinner. + +## How to Play? 🕹ī¸ + +1. **Drag to Spin**: Click and drag the mouse across the spinner to make it spin. The faster you drag, the faster the spinner will rotate. +2. **View Speed**: Watch the speedometer to see how fast the spinner is going. +3. **Set Custom Speed**: Use the input box to set a custom speed for the spinner. +4. **Automatic Spin**: Click the "Spin" button to make the spinner spin without dragging. + +## Screenshots 📸 + +![Fidget Spinner](assets/images/Fidget.png) + + + +## Updates + +- **Speed Display**: Added for real-time feedback. +- **Custom Speed Setting**: Introduced a feature to set custom speed. +- **Automatic Spin**: Added a "Spin" button for automatic spinning. + + + +Enjoy the virtual spinning experience and have fun! diff --git a/Games/Fidget_Spinner_Game/assets/images/Fidget.png b/Games/Fidget_Spinner_Game/assets/images/Fidget.png new file mode 100644 index 0000000000..1f825166d8 Binary files /dev/null and b/Games/Fidget_Spinner_Game/assets/images/Fidget.png differ diff --git a/Games/Fidget_Spinner_Game/index.html b/Games/Fidget_Spinner_Game/index.html new file mode 100644 index 0000000000..3fbad5c860 --- /dev/null +++ b/Games/Fidget_Spinner_Game/index.html @@ -0,0 +1,26 @@ + + + + + Fidget Spinner + + + + + + + + + +Current Speed :
+  +
+ --------------------
+  
+ For Lazy People + + + + + + \ No newline at end of file diff --git a/Games/Fidget_Spinner_Game/index.js b/Games/Fidget_Spinner_Game/index.js new file mode 100644 index 0000000000..9542ea1904 --- /dev/null +++ b/Games/Fidget_Spinner_Game/index.js @@ -0,0 +1,103 @@ +'use strict'; + +var canvas = document.getElementById('canvas'); +var ctx = canvas.getContext('2d'); +var step = 2 * Math.PI / 360; +var radius = 120; + +var dragStart = false; +var angle = 0; +var speed = 7; +document.getElementById("svalue").innerHTML = speed; +ctx.strokeStyle = '#FA8072'; +ctx.lineWidth = radius / 5.5; + +function spin() { + speed = document.getElementById("svalue").innerHTML; +} + +function verifyorder() { + speed = document.getElementById('value').value; + document.getElementById("svalue").innerHTML = speed; +} + + + +canvas.addEventListener('mousedown', function (_ref) { + var clientX = _ref.clientX; + var clientY = _ref.clientY; + + dragStart = { clientX: clientX, clientY: clientY }; +}); +canvas.addEventListener('touchstart', function (_ref2) { + var originalEvent = _ref2.originalEvent; + + dragStart = { + clientX: originalEvent.touches[0].pageX, + clientY: originalEvent.touches[0].pageY + }; +}); +canvas.addEventListener('mousemove', function (_ref3) { + var clientX = _ref3.clientX; + var clientY = _ref3.clientY; + return dragStart && function () { + updateSpeed(dragStart, { clientX: clientX, clientY: clientY }); + dragStart = { clientX: clientX, clientY: clientY }; + }(); +}); +canvas.addEventListener('touchmove', function (_ref4) { + var originalEvent = _ref4.originalEvent; + return dragStart && function () { + updateSpeed(dragStart, { + clientX: originalEvent.touches[0].pageX, + clientY: originalEvent.touches[0].pageY + }); + dragStart = { + clientX: originalEvent.touches[0].pageX, + clientY: originalEvent.touches[0].pageY + }; + }(); +}); +window.addEventListener('mouseup', function () { + dragStart = false; +}); +window.addEventListener('touchend', function () { + dragStart = false; +}); + +function updateSpeed(startPos, endPos) { + speed = (Math.atan2(startPos.clientX - (canvas.offsetLeft + canvas.width / 2), startPos.clientY - (canvas.offsetTop + canvas.height / 2)) - Math.atan2(endPos.clientX - (canvas.offsetLeft + canvas.width / 2), endPos.clientY - (canvas.offsetTop + canvas.height / 2))) * radius; +} + +function render() { + ctx.clearRect(0, 0, canvas.width, canvas.height); + + angle += step * speed; + speed = Math.max(speed - 0.08, Math.min(speed + 0.08, 0)); + + for (var i = 0; i < 3; i++) { + var x = canvas.width / 2 + radius * Math.sin(angle + i * (120 * step)); + var y = canvas.height / 2 - radius * Math.cos(angle + i * (120 * step)); + ctx.beginPath(); + ctx.moveTo(canvas.width / 2, canvas.height / 2); + ctx.lineTo(x, y); + ctx.stroke(); + ctx.closePath(); + + ctx.beginPath(); + ctx.arc(x, y, radius / 2.5, 0, 2 * Math.PI); + ctx.stroke(); + ctx.fill(); + ctx.closePath(); + } + + ctx.beginPath(); + ctx.arc(canvas.width / 2, canvas.height / 2, radius / 2.5, 0, 2 * Math.PI); + ctx.stroke(); + ctx.fill(); + ctx.closePath(); + + window.requestAnimationFrame(render); +} + +render(); \ No newline at end of file diff --git a/Games/Fidget_Spinner_Game/styles.css b/Games/Fidget_Spinner_Game/styles.css new file mode 100644 index 0000000000..09d85eaf10 --- /dev/null +++ b/Games/Fidget_Spinner_Game/styles.css @@ -0,0 +1,14 @@ +body { + margin: 0; + background: #000; + } + + canvas { + display: block; + margin: 0 auto; + } + corner{ + position: absolute; + top: 5px; + right: 10px; + } \ No newline at end of file diff --git a/README.md b/README.md index 9beae2b51a..2bb10ce13f 100644 --- a/README.md +++ b/README.md @@ -321,12 +321,21 @@ This repository also provides one such platforms where contributers come over an | [Recognizing_Figures](https://github.com/kunjgit/GameZone/tree/main/Games/Recognizing_Figures) | [Screen Pet Game](https://github.com/kunjgit/GameZone/tree/main/Games/Screen-Pet-Game) | | [Sudoku_light_theme](https://github.com/kunjgit/GameZone/tree/main/Games/Sudoku_light_theme) | | [Find_the_ball](https://github.com/kunjgit/GameZone/tree/main/Games/Find_the_ball) | + +|[Color The Page](https://github.com/kunjgit/GameZone/tree/main/Games/Color_The_Page)| + +[Fidget Spinner Game](https://github.com/kunjgit/GameZone/tree/main/Games/Fidget_Spinner_Game)| | [Color The Page](https://github.com/kunjgit/GameZone/tree/main/Games/Color_The_Page)| |[Building Blocks Game](https://github.com/kunjgit/GameZone/tree/main/Games/Building_Block_Game)| |[Cartoon character guessing game](https://github.com/kunjgit/GameZone/tree/main/Games/Cartoon_Character_Guessing_Game)| + |[Carrom Board Game](https://github.com/kunjgit/GameZone/tree/main/Games/carrom)| | [Number_Recall_Game](https://github.com/kunjgit/GameZone/tree/main/Games/Number_Recall_Game) | -| [Hit_the_hamster] (https://github.com/kunjgit/GameZone/tree/main/Games/Hit_the_hamster) | + + +| [Hit_the_hamster](https://github.com/kunjgit/GameZone/tree/main/Games/Hit_the_hamster) | + + | [Forest_Guardian](https://github.com/kunjgit/GameZone/tree/main/Games/Forst_Guardian) | | [Sudoku_light_theme](https://github.com/kunjgit/GameZone/tree/main/Games/Sudoku_light_theme) | | [Find_the_ball](https://github.com/kunjgit/GameZone/tree/main/Games/Find_the_ball) | @@ -804,8 +813,10 @@ This repository also provides one such platforms where contributers come over an | [Bunny is Lost](https://github.com/kunjgit/GameZone/tree/main/Games/Bunny_is_Lost)| |[Steam_Punk](https://github.com/kunjgit/GameZone/tree/main/Games/Steam_Punk)| |[Tower Defence Game](https://github.com/Will2Jacks/GameZoneForked/tree/Task/Games/Tower_Defence_Game)| + |[Dot_Dash](https://github.com/kunjgit/GameZone/tree/main/Games/Dot_Dash)| + |[Ghost Busting Game](https://github.com/kunjgit/GameZone/tree/main/Games/Ghost_busting_game)| |[Wheel_of_fortune](https://github.com/Will2Jacks/GameZoneForked/tree/Task/Games/Wheel_of_fortune)| |[Dot_Box_Game](https://github.com/kunjgit/GameZone/tree/main/Games/Dot_Box_Game)| diff --git a/assets/images/Fidget.png b/assets/images/Fidget.png new file mode 100644 index 0000000000..1f825166d8 Binary files /dev/null and b/assets/images/Fidget.png differ diff --git a/assets/js/gamesData.json b/assets/js/gamesData.json index ef609c568f..32b08e10b6 100644 --- a/assets/js/gamesData.json +++ b/assets/js/gamesData.json @@ -2000,6 +2000,136 @@ "thumbnailUrl": "Dot_Connect.png" }, + +"396":{ + "gameTitle": "path finder puzzle", + "gameUrl": "path_finder", + "thumbnailUrl": "pathfinder.png" +}, +"414":{ + "gameTitle": "NameFate", + "gameUrl": "namefate", + "thumbnailUrl": "namefate.png" +} +, +"500":{ + "gameTitle": "Menja block breaker", + "gameUrl": "Menja_block_breaker", + "thumbnailUrl": "menja_Block_breaker.png" +}, +"393":{ + + "gameTitle": "Pop My Balloon", + "gameUrl": "Pop_My_Balloon", + "thumbnailUrl": "Pop_My_Balloon.png" + +}, +"397":{ + "gameTitle": "Tower Stack", + "gameUrl": "Tower_Stack", + "thumbnailUrl": "Tower_Stack.png" + +}, +"395":{ + + "gameTitle": "Virtual Pet Game", + "gameUrl": "Virtual_Pet_Game", + "thumbnailUrl": "Virtual_Pet_Game.png" + + "gameTitle": "path finder puzzle", + "gameUrl": "path_finder", + "thumbnailUrl": "pathfinder.png" +}, +"411":{ "gameTitle": "Tiny Fishing", +"gameUrl": "Tiny_Fishing", +"thumbnailUrl": "Tiny_Fishing.png" +}, +"398":{ +"410":{ + "gameTitle": "Shrek Vs Wild", + "gameUrl": "Shrek_Vs_Wild", + "thumbnailUrl": "Shrek_Vs_Wild.png" +}, +"409":{ + "gameTitle": "Hover_Board_Effect", + "gameUrl": "Hover_Board_Effect", + "thumbnailUrl": "Hover_Board_Effect.png" +}, +"405":{ + "gameTitle": "Candy_Crush_Saga", + "gameUrl": "Candy_Crush_Saga", + "thumbnailUrl": "Candy_Crush_Saga.png" +},"419":{ + + "gameTitle": "16_Puzzle", + "gameUrl": "16_Puzzle", + "thumbnailUrl": "16_Puzzle.png" +}, +"420":{ + "gameTitle" : "Colour_Generator_Game", + "gameUrl": "Colour_Generator_Game", + "thumbnailUrl": "Colour_Generator_Game.png" + }, +"406":{ + "gameTitle": "Knife_hit", + "gameUrl": "Knife_hit", + "thumbnailUrl": "Knife_hit.png" +},"415":{ + "gameTitle": "Anagram_Checker_Game", + "gameUrl": "Anagram_Checker_Game", + "thumbnailUrl": "Anagram_Checker_Game.png" + +}, +"407":{ + "gameTitle": "Screen_Pet_Game", + "gameUrl": "Screen_Pet_Game", + "thumbnailUrl": "Screen_Pet_Game.png" + +},"416":{ + + + "gameTitle": "rapid_click_frenzy", + "gameUrl": "rapid_click_frenzy", + "thumbnailUrl": "rapidgame.png" + + + +} + ,"408":{ + "gameTitle": "Pen_Pointer_Fight", + "gameUrl": "PenPointerFight", + "thumbnailUrl": "PenPointerFight.png" + }, +"409":{ + "gameTitle": "Guess_The_Song", + "gameUrl": "Guess_The_Song", + "thumbnailUrl": "Guess_The_Song.png" +} + +},"418":{ + "gameTitle": "Brick Buster", + "gameUrl": "Brick Buster", + "thumbnailUrl": "Brick.png" + } + + + +},"410":{ + "gameTitle": "Brick Buster", + "gameUrl": "Brick Buster", + "thumbnailUrl": "Brick.png" + }, + "419":{ + "gameTitle": "Soccer", + "gameUrl": "Soccer", + "thumbnailUrl": "Soccer" +}, +"411":{"gameTitle": "Pen_Pointer_Fight", +"gameUrl": "PenPointerFight", +"thumbnailUrl": "PenPointerFight.png" +}, + + "398": { "gameTitle": "path finder puzzle", "gameUrl": "path_finder", @@ -2101,6 +2231,7 @@ "thumbnailUrl": "MathQuiz.png" }, "418":{ + "gameTitle": "MathQuiz", "gameUrl": "MathQuiz", "thumbnailUrl": "MathQuiz.png" @@ -2109,16 +2240,21 @@ "gameTitle":"Puzzle-Game", "gameUrl":"puzzle-game", "thumbnailUrl":"puzzle-game.png" -} -<<<<<<< HEAD +}, + + + "419":{ "gameTitle": "Pottery", "gameUrl": "Pottery-Game", "thumbnailUrl": "Pottery.png" -======= ->>>>>>> c24ab932e1702441882a65b80d713ea232e18c46 - -} -} +}, +"421":{ + "gameTitle":"Fidget_Spinner_Game", + "gameUrl":"Fidget_Spinner_Game", + "thumbnailUrl":"Fidget.png" +}, + +