This repository contains a fun and interactive FLAMES game, which predicts the relationship compatibility between two names using the traditional FLAMES algorithm. The FLAMES game is often used to determine if two people are Friends, Lovers, have Affection, will Marry, are Enemies, or are Siblings based on their names.
1️⃣: Features:
🔸 Responsive Design: The game is designed to be responsive and visually appealing with a gradient background.
🔸 Interactive Form: Users can input their name and their crush's name, and submit the form to get their relationship result.
🔸 Animated Buttons: The submit and clear buttons have hover and active states that enhance the user experience.
🔸 FLAMES Logic Implementation: The core FLAMES algorithm is implemented in JavaScript to calculate the relationship result based on the input names.
🔸 Countdown Timer: A countdown timer displays the remaining time in seconds before the result disappears, adding a fun dynamic to the game.
2️⃣: Technologies Used:
🔸 HTML: For the basic structure of the webpage.
🔸 CSS: For styling the webpage, including the use of linear and radial gradients, and responsive design.
🔸 JavaScript: For the game logic and form handling, including input validation, result calculation, and countdown timer.
Contains JavaScript functions for handling form submission, clearing inputs, and computing the FLAMES result.
Implements the FLAMES algorithm.
3️⃣: Detailed Code Explanation:
HTML Structure
🔹 Form: The form contains input fields for "Your Name" and "Your Crush's Name", along with submit and clear buttons.
🔹 Result Display: A span element is used to display the FLAMES result.
CSS Styling:
🔹 Body: The body has a radial gradient background transitioning from pink to light blue.
🔹 Form: The form has a linear gradient background transitioning from white to pink, with padding for better alignment.
🔹__Buttons:__ The submit and clear buttons have shadow effects, rounded corners, and color transitions on hover and active states.
JavaScript Functions:
🔹 clearnames(e): Clears the input fields when the clear button is clicked.
🔹 findResult(boy, girl, count): Calculates the FLAMES result based on the names and updates the result display with appropriate background color and text.
🔹 flames(e): Handles form submission, validates input, calculates the count for the FLAMES game, and calls findResult to display the result.