-
Notifications
You must be signed in to change notification settings - Fork 839
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
216 changed files
with
104,451 additions
and
745 deletions.
There are no files selected for viewing
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,37 @@ | ||
| # **Auddle: Audio Wordle** | ||
|
|
||
| --- | ||
|
|
||
| <br> | ||
|
|
||
| ## **Description 📃** | ||
| Auddle is a fun and challenging word-guessing game where players must identify the correct word based on an audio clue. Each round provides a new audio clip, and players have six guesses to find the correct answer. The game combines the classic Wordle mechanics with an audio twist, offering a unique and engaging experience. | ||
| - | ||
|
|
||
| ## **functionalities 🎮** | ||
| 1. Randomized Audio Clues: Each game round starts with a random audio clip from a pre-defined list. | ||
| 2. Multiple Attempts: Players have six attempts to guess the correct word. | ||
| 3. Feedback System: The game provides color-coded feedback to indicate correct letters, correct positions, and incorrect letters. | ||
| 4. Audio Playback: Players can replay the audio clue as many times as needed. | ||
| - | ||
| <br> | ||
|
|
||
| ## **How to play? 🕹️** | ||
| 1. Start the Game: Click the start button to begin a new game round. | ||
| 2. Listen to the Audio Clue: An audio clip will play. You can replay the clip by clicking the replay button. | ||
| 3. Make a Guess: Type in your guess and submit it. | ||
| 4. Receive Feedback: The game will provide feedback with colored tiles: | ||
| - Green: Correct letter in the correct position. | ||
| - Yellow: Correct letter in the wrong position. | ||
| - Gray: Incorrect letter. | ||
| 5. Repeat: Use the feedback to make a better guess. You have six attempts to find the correct word. | ||
| 6. Win or Lose: If you guess the word correctly within six attempts, you win! Otherwise, the game will reveal the correct answer. | ||
| - | ||
|
|
||
| <br> | ||
|
|
||
| ## **Screenshots 📸** | ||
|
|
||
|  | ||
|
|
||
| <br> |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,140 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <title>Auddle - Audio Wordle!</title> | ||
| <link rel="stylesheet" href="style.css" type="text/css"> | ||
| <link rel = "icon" href = "images/d.svg" type = "image/x-icon"> | ||
| </head> | ||
| <body> | ||
|
|
||
| <div class="title-box"> | ||
| au<span id="dd"><img src=images/d.svg id="title-symbol"><img src=images/d.svg id="title-symbol"></span>le<sup class="era-text"></sup> | ||
| </div> | ||
|
|
||
| <p id="counter"></p> | ||
|
|
||
| <div class="container"> | ||
| <div class="audio-clip"> | ||
| <div class="text-instructions"> | ||
| Play the audio clip | ||
| </div> | ||
| <audio class="clue1" controls controlsList="nodownload" src="">Your browser does not support the <code>audio</code> element. | ||
| </audio> | ||
| </div> | ||
| <div class="word-box"> | ||
| <div class="text-instructions" id="guess-instructions">Guess the <b>SINGER</b> in 6 attempts!<br></div> | ||
| <div class="container-box"> | ||
| <div class="row-1"> | ||
| <span id="box-1"></span> | ||
| <span id="box-2"></span> | ||
| <span id="box-3"></span> | ||
| <span id="box-4"></span> | ||
| <span id="box-5"></span> | ||
| <span id="box-6"></span> | ||
| <span id="box-7"></span> | ||
| <span id="box-8"></span> | ||
| </div> | ||
| <div class="row-2"> | ||
| <span id="box-1"></span> | ||
| <span id="box-2"></span> | ||
| <span id="box-3"></span> | ||
| <span id="box-4"></span> | ||
| <span id="box-5"></span> | ||
| <span id="box-6"></span> | ||
| <span id="box-7"></span> | ||
| <span id="box-8"></span> | ||
| </div> | ||
| <div class="row-3"> | ||
| <span id="box-1"></span> | ||
| <span id="box-2"></span> | ||
| <span id="box-3"></span> | ||
| <span id="box-4"></span> | ||
| <span id="box-5"></span> | ||
| <span id="box-6"></span> | ||
| <span id="box-7"></span> | ||
| <span id="box-8"></span> | ||
| </div> | ||
| <div class="row-4"> | ||
| <span id="box-1"></span> | ||
| <span id="box-2"></span> | ||
| <span id="box-3"></span> | ||
| <span id="box-4"></span> | ||
| <span id="box-5"></span> | ||
| <span id="box-6"></span> | ||
| <span id="box-7"></span> | ||
| <span id="box-8"></span> | ||
| </div> | ||
| <div class="row-5"> | ||
| <span id="box-1"></span> | ||
| <span id="box-2"></span> | ||
| <span id="box-3"></span> | ||
| <span id="box-4"></span> | ||
| <span id="box-5"></span> | ||
| <span id="box-6"></span> | ||
| <span id="box-7"></span> | ||
| <span id="box-8"></span> | ||
| </div> | ||
| <div class="row-6"> | ||
| <span id="box-1"></span> | ||
| <span id="box-2"></span> | ||
| <span id="box-3"></span> | ||
| <span id="box-4"></span> | ||
| <span id="box-5"></span> | ||
| <span id="box-6"></span> | ||
| <span id="box-7"></span> | ||
| <span id="box-8"></span> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <div class="message-box"><div class="message">too short!</div></div> | ||
| <div class="finish"><span class="finish_"></span><a target = "_blank" href="" id="link"></a></div> | ||
| <div class="keyboard"> | ||
| <div class="row1"> | ||
| <div class="q">Q</div> | ||
| <div class="w">W</div> | ||
| <div class="e">E</div> | ||
| <div class="r">R</div> | ||
| <div class="t">T</div> | ||
| <div class="y">Y</div> | ||
| <div class="u">U</div> | ||
| <div class="i">I</div> | ||
| <div class="o">O</div> | ||
| <div class="p">P</div> | ||
| </div> | ||
| <div class="row2"> | ||
| <div class="a">A</div> | ||
| <div class="s">S</div> | ||
| <div class="d">D</div> | ||
| <div class="f">F</div> | ||
| <div class="g">G</div> | ||
| <div class="h">H</div> | ||
| <div class="j">J</div> | ||
| <div class="k">K</div> | ||
| <div class="l">L</div> | ||
| </div> | ||
| <div class="row3"> | ||
| <div class="Backspace"><img id="bksp" src="images/backspace-outline.svg" alt="backspace"></div> | ||
| <div class="z">Z</div> | ||
| <div class="x">X</div> | ||
| <div class="c">C</div> | ||
| <div class="v">V</div> | ||
| <div class="b">B</div> | ||
| <div class="n">N</div> | ||
| <div class="m">M</div> | ||
| <div class="Enter"><img id="enter" src="images/return.svg" alt="enter"></div> | ||
| </div> | ||
| </div> | ||
| <div class="credits"> | ||
| Made by <a id="github" href="https://sawmill811.github.io/">Khushi Kalra | ||
| </a> | ||
| <a id="github-logo" href="https://github.com/abckhush"><img src="images/github.svg" style="width:100%" alt="github"> | ||
| </a> | ||
|
|
||
| </div> | ||
| </div> | ||
| </body> | ||
| <script type="text/javascript" src="script.js"></script> | ||
| </html> |
Oops, something went wrong.