dishamodi0910 · AmruthaPariprolu · Aug 9, 2024 · Aug 9, 2024 · Aug 9, 2024 · Aug 9, 2024
diff --git a/New_APIs/Climacell_API/README.md b/New_APIs/Climacell_API/README.md
@@ -0,0 +1,33 @@
+# Weather Forecast API
+
+This project is a simple web application that fetches and displays the current weather information for a specified location using the Climacell (Tomorrow.io) API.
+
+## Features
+
+- Input a location (latitude and longitude) to fetch its current weather, including temperature and precipitation.
+- Display the fetched data on the web page.
+
+## Technologies Used
+
+- HTML
+- CSS
+- JavaScript
+- [Climacell (Tomorrow.io) API](https://www.tomorrow.io/weather-api/)
+
+## How to Run
+
+1. Clone the repository or download the files.
+2. Replace `YOUR_API_KEY` in `index.js` with your Climacell API key.
+3. Open the `index.html` file in your web browser.
+4. Enter a location (latitude and longitude, e.g., `40.7128,-74.0060` for New York) and click the "Get Weather" button to see the current weather.
+
+## Example Usage
+
+- Input: `40.7128,-74.0060` (New York)
+- Output:
+  - Temperature: 72°F
+  - Precipitation: 0.2 mm
+
+## License
+
+This project is open-source and available under the MIT License.
diff --git a/New_APIs/Climacell_API/index.html b/New_APIs/Climacell_API/index.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Weather App</title>
+    <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+    <div class="weather-container">
+        <h1>Weather Information</h1>
+        <div class="location-input">
+            <label for="location">Enter Location:</label>
+            <input type="text" id="location" placeholder="e.g., New York, NY">
+        </div>
+        <button id="fetch-weather">Get Weather</button>
+        <div id="weather-info">
+            <p id="temperature">Temperature: </p>
+            <p id="precipitation">Precipitation: </p>
+        </div>
+    </div>
+
+    <script src="index.js"></script>
+</body>
+</html>
diff --git a/New_APIs/Climacell_API/index.js b/New_APIs/Climacell_API/index.js
@@ -0,0 +1,57 @@
+document.addEventListener('DOMContentLoaded', function () {
+    document.getElementById('fetchWeatherButton').addEventListener('click', fetchWeather);
+});
+
+async function fetchWeather() {
+    const location = document.getElementById('location').value;
+
+    // Sample coordinates for New York City; you may use a geocoding service to convert the location to coordinates
+    const coordinates = {
+        "New York": "40.7128,-74.0060",
+        // Add more locations as needed
+    };
+
+    const coords = coordinates[location] || "40.7128,-74.0060"; // Default to New York if location is not recognized
+    const apiKey = 'YOUR_CLIMACELL_API_KEY';  // Replace with your actual Climacell API key
+    const endpoint = `https://api.tomorrow.io/v4/timelines?location=${coords}&fields=temperature,precipitation&units=imperial&apikey=${apiKey}`;
+
+    try {
+        const response = await fetch(endpoint, {
+            method: 'GET',
+            headers: {
+                'Content-Type': 'application/json',
+            }
+        });
+
+        if (!response.ok) {
+            throw new Error(`HTTP error! Status: ${response.status}`);
+        }
+
+        const data = await response.json();
+        console.log('Fetched data:', data);
+
+        if (data.data && data.data.timelines && data.data.timelines.length > 0) {
+            const weatherData = data.data.timelines[0].intervals[0].values;
+            displayWeather(weatherData);
+        } else {
+            displayError('No weather data found.');
+        }
+    } catch (error) {
+        console.error('Error fetching weather data:', error);
+        displayError('Failed to fetch weather data.');
+    }
+}
+
+function displayWeather(weather) {
+    const weatherDiv = document.getElementById('weather');
+    weatherDiv.innerHTML = `
+        <h3>Weather Information</h3>
+        <p><strong>Temperature:</strong> ${weather.temperature}°F</p>
+        <p><strong>Precipitation:</strong> ${weather.precipitation} mm</p>
+    `;
+}
+
+function displayError(message) {
+    const weatherDiv = document.getElementById('weather');
+    weatherDiv.innerHTML = `<p>${message}</p>`;
+}
diff --git a/New_APIs/Climacell_API/manifest.json b/New_APIs/Climacell_API/manifest.json
@@ -0,0 +1,22 @@
+{
+    "name": "Weather and Image Processing App",
+    "short_name": "WeatherApp",
+    "description": "A web application for uploading images, processing them, and retrieving weather data using the Climacell API.",
+    "start_url": ".",
+    "display": "standalone",
+    "background_color": "#ffffff",
+    "theme_color": "#007bff",
+    "icons": [
+      {
+        "src": "icon/manifest-icon-192.png",
+        "sizes": "192x192",
+        "type": "image/png"
+      },
+      {
+        "src": "icon/manifest-icon-512.png",
+        "sizes": "512x512",
+        "type": "image/png"
+      }
+    ]
+  }
+