Merge pull request #313 from atul2727/Bhagavad_Gita_API

Bhagavad_Gita_Api
dishamodi0910 · Jul 20, 2024 · 20c2daf · 20c2daf
2 parents 3ad163b + 21fdd4e
commit 20c2daf
Show file tree

Hide file tree

Showing 6 changed files with 187 additions and 0 deletions.
diff --git a/Existing_API_Collection/Bhagavad_Gita_API/README.md b/Existing_API_Collection/Bhagavad_Gita_API/README.md
@@ -0,0 +1,30 @@
+# Bhagavad Gita Quotes
+
+Welcome to the Bhagavad Gita Quotes web application! This app is designed to help you explore and discover quotes from the Bhagavad Gita, offering wisdom and inspiration. You can either select specific chapters and verses or get a random quote every time you click the "Get Random Quote" button.
+
+## Features
+- **Fetch Specific Quotes:** Select a chapter and verse to get a specific quote from the Bhagavad Gita.
+- **Random Quote:** Discover a random quote every time you click the "Get Random Quote" button.
+- **Error Handling:** Robust error handling to ensure meaningful error messages and smooth usage.
+- **Simple and Easy-to-Use Interface:** Designed with utmost simplicity for an easy and intuitive user experience.
+- **Dropdown Selection:** Easily select chapters and verses from dropdown lists to fetch specific quotes.
+
+## Technologies Used
+- HTML
+- Vanilla CSS
+- JavaScript
+- API (for fetching data)
+
+# API Integration
+This application uses the [Bhagavad Gita API](https://bhagavadgitaapi.in/) to fetch quotes from the Bhagavad Gita.
+
+## Installation
+To set up the Brewery Finder API locally, follow these steps:
+
+1. Clone the repository.
+2. Switch to Existing_API_Collection folder `cd Existing_API_Collection`
+3. Navigate to the `Bhagavad_Gita_API` directory.
+4. Open the `index.html` file in your browser.
+
+## Screenshot
+![Screenshot](screenshot.png)
diff --git a/Existing_API_Collection/Bhagavad_Gita_API/index.html b/Existing_API_Collection/Bhagavad_Gita_API/index.html
@@ -0,0 +1,31 @@
+<!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>Bhagavad Gita Quotes</title>
+	<link rel="stylesheet" href="style.css">
+</head>
+
+<body>
+	<div class="container">
+		<h1>Bhagavad Gita Quotes</h1>
+		<div class="selector">
+			<label for="chapterSelect">Chapter:</label>
+			<select id="chapterSelect"></select>
+			<label for="verseSelect">Verse:</label>
+			<select id="verseSelect"></select>
+		</div>
+		<button id="getQuoteButton">Get Quote</button>
+		<button id="randomQuoteButton">Get Random Quote</button>
+		<div id="quoteContainer">
+			<p id="slok"></p>
+			<p id="translation"></p>
+		</div>
+	</div>
+	<script src="script.js"></script>
+</body>
+
+</html>
diff --git a/Existing_API_Collection/Bhagavad_Gita_API/screenshot.png b/Existing_API_Collection/Bhagavad_Gita_API/screenshot.png
diff --git a/Existing_API_Collection/Bhagavad_Gita_API/script.js b/Existing_API_Collection/Bhagavad_Gita_API/script.js
@@ -0,0 +1,68 @@
+document.addEventListener("DOMContentLoaded", () => {
+  const getQuoteButton = document.getElementById("getQuoteButton");
+  const randomQuoteButton = document.getElementById("randomQuoteButton");
+  const slokElement = document.getElementById("slok");
+  const translationElement = document.getElementById("translation");
+  const chapterSelect = document.getElementById("chapterSelect");
+  const verseSelect = document.getElementById("verseSelect");
+
+
+  // Populating chapter and verse options
+  for (let i = 1; i <= 18; i++) {
+    let option = document.createElement("option");
+    option.value = i;
+    option.textContent = i;
+    chapterSelect.appendChild(option);
+  }
+
+
+  for (let i = 1; i <= 20; i++) {
+    let option = document.createElement("option");
+    option.value = i;
+    option.textContent = i;
+    verseSelect.appendChild(option);
+  }
+
+  getQuoteButton.addEventListener("click", async () => {
+    const chapter = chapterSelect.value;
+    const verse = verseSelect.value;
+
+    try {
+      const response = await fetch(`https://bhagavadgitaapi.in/slok/${chapter}/${verse}/`);
+      if (!response.ok) {
+        throw new Error("Network response was not ok");
+      }
+      const data = await response.json();
+      slokElement.textContent = `Slok: ${data.slok}`;
+      translationElement.textContent = `Translation: ${data.purohit.et}`;
+    }
+    catch (error) {
+      slokElement.textContent = "An error occurred while fetching the quote.";
+      translationElement.textContent = "";
+      console.error("Fetch error:", error);
+    }
+  });
+
+
+  // Random button
+  randomQuoteButton.addEventListener("click", async () => {
+    const chapter = Math.floor(Math.random() * 18) + 1;
+    const verse = Math.floor(Math.random() * 20) + 1;
+
+
+    try {
+      const response = await fetch(`https://bhagavadgitaapi.in/slok/${chapter}/${verse}/`);
+      if (!response.ok) {
+        throw new Error("Error!");
+      }
+      const data = await response.json();
+      slokElement.textContent = `Slok: ${data.slok}`;
+      translationElement.textContent = `Translation: ${data.purohit.et}`;
+    }
+    catch (error) {
+      slokElement.textContent = "error while fetching the quote.";
+      translationElement.textContent = "";
+      console.error("error:", error);
+    }
+  });
+});
diff --git a/Existing_API_Collection/Bhagavad_Gita_API/style.css b/Existing_API_Collection/Bhagavad_Gita_API/style.css
@@ -0,0 +1,56 @@
+body {
+	font-family: Arial, sans-serif;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	height: 100vh;
+	background-color: #f0f0f0;
+	margin: 0;
+}
+
+.container {
+	text-align: center;
+	background-color: #fff;
+	padding: 20px;
+	border-radius: 8px;
+	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+}
+
+.selector {
+	margin-bottom: 20px;
+}
+
+label {
+	margin: 0 10px 0 0;
+}
+
+select {
+	padding: 5px;
+	font-size: 16px;
+	margin-right: 10px;
+}
+
+button {
+	padding: 10px 20px;
+	font-size: 16px;
+	margin-top: 20px;
+	cursor: pointer;
+	border: none;
+	border-radius: 5px;
+	background-color: #007BFF;
+	color: #fff;
+}
+
+button:hover {
+	background-color: #0056b3;
+}
+
+#quoteContainer {
+	margin-top: 20px;
+}
+
+#slok,
+#translation {
+	margin: 10px 0;
+	font-size: 18px;
+}
diff --git a/Existing_API_Collection/README.md b/Existing_API_Collection/README.md
@@ -24,6 +24,8 @@
 |[GeoAPI](./GeoAPI/)| GeoAPI is a simple RESTful API that allows you to convert addresses to geographic coordinates (latitude and longitude) and vice versa. This API is built using Node.js and Express.|
 |[Books API](./Books_API/)| The Google Books API allows developers to access a wealth of information about books, including their titles, authors, publishers, publication dates, and descriptions. |
 |[Currency Converter API](./Currency_Converter_API/)| Currency_Converter is a simple RESTful API that allows you to convert currency values to different currency|
+|[Brewery_API](./Brewery_API/)| Brewery Finder API is designed to help you explore the world of breweries by providing detailed information about various breweries across different states.|
 |[CoinGecko API](./CoinGecko_API/)| This API is use to fetch Top 100 Crypto Currencies and display comprehensive data about them with market capital, price etc.|
 |[Gemini API](./Gemini_API/)| The Google Gemini API is a powerful tool that leverages cutting-edge generative AI models to assist developers and businesses in various tasks. It provides functionalities such as text generation, content creation, and creative assistance.|
 |[Brewery_API](./Brewery_API/)| Brewery Finder API is designed to help you explore the world of breweries by providing detailed information about various breweries across different states.|
+|[Bhagavad_Gita_API](./Bhagavad_Gita_API/)| Bhagavad Gita API provides quotes from the Bhagavad Gita, offering wisdom and inspiration.|