From c4572f63c274802dbb93ed45176dbaae491e2e63 Mon Sep 17 00:00:00 2001
From: "Nathan S.R" <122852451+linuxguist@users.noreply.github.com>
Date: Sat, 6 Apr 2024 17:08:10 +0530
Subject: [PATCH] Add files via upload

---
 index.html |  76 +++++++++++++++++++++++++++--
 script.js  | 138 +++++++++++++++++++++++++++++++++++++++++++++++++++--
 style.css  |   6 +--
 3 files changed, 210 insertions(+), 10 deletions(-)

diff --git a/index.html b/index.html
index c001a2f..50b4c53 100644
--- a/index.html
+++ b/index.html
@@ -15,7 +15,7 @@
 
 <center><h1>Information Center</h1></center>
 
-<div class="container" id="wrapper">
+<div class="container" id="wrapper" style="margin-top: 20px;">
   <div class="container-fluid" id="current-weather">
     <div class="row">
       
@@ -66,8 +66,8 @@ <h6>Low: <spam id="mainTempLow"></spam>°</h6>
           <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
         </div>
         <div class="modal-body">
-          <p>Due to weather api restrictions, data can only be shown via HTTP request.</p>
-          <p>Sorry for the inconvenience.</p>
+          <p></p>
+          <p></p>
         </div>
         <div class="modal-footer">
           <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
@@ -158,5 +158,75 @@ <h5 id="forecast-day-4-main">°</h5>
 
 <script src='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/js/bootstrap.min.js'></script><script  src="./script.js"></script>
 
+<script src="https://code.responsivevoice.org/responsivevoice.js"></script>
+
+<!--
+<script src="https://code.responsivevoice.org/responsivevoice.js?key=QugTbpmd"></script>
+-->
+
+<script src="https://cdn.jsdelivr.net/jquery/2.2.1/jquery.min.js"></script>
+
+<script>
+
+    function voiceStartCallback() {
+        console.log("Voice started");
+    }
+    
+    function voiceEndCallback() {
+        console.log("Voice ended");
+    }
+    
+    var parameters = {
+        onstart: voiceStartCallback,
+        onend: voiceEndCallback,
+        rate: 0.95
+    }
+    
+</script>
+
+
+<script type="text/javascript">
+
+/*
+
+responsiveVoice.speak("Hello, this is a test using callbacks","UK English Female", parameters);
+
+responsiveVoice.speak("hello world", "UK English Male", {pitch: 2});
+
+responsiveVoice.speak("hello world", "UK English Male", {rate: 1.5});
+
+responsiveVoice.speak("hello world", "UK English Male", {volume: 1});
+
+*/
+
+</script>    
+
+
+<script type="text/javascript">
+
+// var text = document.getElementById(secondElementChild).innerHTML;
+   
+// var text = "Equals";
+
+// responsiveVoice.speak(text,'UK English Female', parameters);  
+  
+</script> 
+
+
+<style>
+footer h4 {
+   position: fixed;
+   left: 0;
+   bottom: 0;
+   width: 100%;
+   padding: 10px;
+   background-color: indigo;
+   color: white;
+   text-align: center;
+}
+</style>
+
+<footer><center><a href="https://responsivevoice.org" title="ResponsiveVoice"><h4>Powered By ResponsiveVoice Text-To-Speech For Non-commercial personal or non-profit project</h4></a></center></footer>
+
 </body>
 </html>
diff --git a/script.js b/script.js
index 4ecdc42..bf721e6 100644
--- a/script.js
+++ b/script.js
@@ -50,11 +50,11 @@ function getClientPosition(){
 function getWeatherData(latitude, longitude){
   $.ajax({
     type: "GET",
-    url: "https://cors-anywhere.herokuapp.com/http://api.openweathermap.org/data/2.5/forecast/daily?APPID=9b4bbf30228eb8528d36e79d05da1fac&lat=" + latitude + "&lon=" + longitude + "&units=metric&cnt=5",
+    url: "https://api.openweathermap.org/data/2.5/forecast/daily?APPID=9b4bbf30228eb8528d36e79d05da1fac&lat=" + latitude + "&lon=" + longitude + "&units=metric&cnt=5",
     cache: true,
-    headers: {
-      "Access-Control-Allow-Headers": "x-requested-with"
-    },
+    // headers: {
+      // "Access-Control-Allow-Headers": "x-requested-with"
+    // },
     success: function(forecast){
       globalForecast = forecast;
       updateForecast(forecast);
@@ -100,6 +100,136 @@ function updateForecast(forecast){
     $("#forecast-day-" + i + "-ht").text(Math.round(day.temp.max));
     $("#forecast-day-" + i + "-lt").text(Math.round(day.temp.min));
   }
+
+
+// testi="Equals,,,,"+textvi+",,,,I Repeat.,,,,"+textvi;
+//    console.log(testi);
+     // responsiveVoice.speak(textvi,'UK English Female', parameters);  
+       // responsiveVoice.speak("    I Repeat.    ",'UK English Female', parameters);  
+//       responsiveVoice.speak( testi.toString(), 'UK English Female', parameters);
+
+  responsiveVoice.speak("Hi, Welcome to the Information Center.", 'UK English Female', parameters);
+
+  console.log(new Date().toLocaleTimeString());
+
+
+  setTimeout(function (){
+  
+  // Something you want delayed.
+
+    responsiveVoice.speak("Time now is,,,,. : "+(new Date().toLocaleTimeString()), 'UK English Female', parameters);    
+            
+}, 4000); // How long you want the delay to be, measured in milliseconds.
+
+
+  console.log($('#localDate').html());
+
+
+  setTimeout(function (){
+  
+  // Something you want delayed.
+
+    responsiveVoice.speak("Day today is,,,,. : "+$('#localDate').html(), 'UK English Female', parameters);    
+            
+}, 10000); // How long you want the delay to be, measured in milliseconds.
+
+
+
+
+
+  console.log($('#cityName').html());
+  console.log($('#cityCode').html());
+
+  console.log($('#mainTemperature').html());
+  console.log($('#tempDescription').html());
+
+  console.log($('#mainTempHot').html());
+  console.log($('#mainTempLow').html());
+  
+  console.log($('#humidity').html());
+  console.log($('#wind').html());
+
+  setTimeout(function (){
+  
+  // Something you want delayed.
+
+    responsiveVoice.speak("Temperature in "+$('#cityName').html()+","+$('#cityCode').html()+" is. "+$('#mainTemperature').html()+" Degree Celcius."+" Its description is. "+$('#tempDescription').html()+". Today's expected minimum temperature is "+$('#mainTempLow').html()+" degree celcius. Expected maximum temperature is "+$('#mainTempHot').html()+" degree celcius. Humidity is "+$('#humidity').html()+" percent. Wind speed is "+$('#wind').html()+" meter per second.", 'UK English Female', parameters);    
+            
+}, 16000); // How long you want the delay to be, measured in milliseconds.
+
+
+
+var days = {
+   'Mon': 'Monday',
+   'Tue': 'Tuesday',
+   'Wed': 'Wednesday',
+   'Thu': 'Thursday',
+   'Fri': 'Friday',
+   'Sat': 'Saturday',
+   'Sun': 'Sunday'
+}
+
+// days[date]
+
+  console.log(days[$('#forecast-day-1-name').html()]);
+  console.log($('#forecast-day-1-main').html());
+  console.log($('#forecast-day-1-ht').html());
+  console.log($('#forecast-day-1-lt').html());
+
+  console.log(days[$('#forecast-day-2-name').html()]);
+  console.log($('#forecast-day-2-main').html());
+  console.log($('#forecast-day-2-ht').html());
+  console.log($('#forecast-day-2-lt').html());
+
+  console.log(days[$('#forecast-day-3-name').html()]);
+  console.log($('#forecast-day-3-main').html());
+  console.log($('#forecast-day-3-ht').html());
+  console.log($('#forecast-day-3-lt').html());
+
+  console.log(days[$('#forecast-day-4-name').html()]);
+  console.log($('#forecast-day-4-main').html());
+  console.log($('#forecast-day-4-ht').html());
+  console.log($('#forecast-day-4-lt').html());
+
+
+
+  setTimeout(function (){
+  
+  // Something you want delayed.
+
+    responsiveVoice.speak("Forecast Temperature for "+days[$('#forecast-day-1-name').html()]+" is "+$('#forecast-day-1-main').html()+" degree celcius. Expected high is "+$('#forecast-day-1-ht').html()+" degree celcius. Expected low is "+$('#forecast-day-1-lt').html()+" degree celcius.", 'UK English Female', parameters);    
+            
+}, 36000); // How long you want the delay to be, measured in milliseconds.
+
+
+  setTimeout(function (){
+  
+  // Something you want delayed.
+
+    responsiveVoice.speak("Forecast Temperature for "+days[$('#forecast-day-2-name').html()]+" is "+$('#forecast-day-2-main').html()+" degree celcius. Expected high is "+$('#forecast-day-2-ht').html()+" degree celcius. Expected low is "+$('#forecast-day-2-lt').html()+" degree celcius.", 'UK English Female', parameters);    
+            
+}, 48000); // How long you want the delay to be, measured in milliseconds.
+
+
+
+  setTimeout(function (){
+  
+  // Something you want delayed.
+
+    responsiveVoice.speak("Forecast Temperature for "+days[$('#forecast-day-3-name').html()]+" is "+$('#forecast-day-3-main').html()+" degree celcius. Expected high is "+$('#forecast-day-3-ht').html()+" degree celcius. Expected low is "+$('#forecast-day-3-lt').html()+" degree celcius.", 'UK English Female', parameters);    
+            
+}, 60000); // How long you want the delay to be, measured in milliseconds.
+
+
+  setTimeout(function (){
+  
+  // Something you want delayed.
+
+    responsiveVoice.speak("Forecast Temperature for "+days[$('#forecast-day-4-name').html()]+" is "+$('#forecast-day-4-main').html()+" degree celcius. Expected high is "+$('#forecast-day-4-ht').html()+" degree celcius. Expected low is "+$('#forecast-day-4-lt').html()+" degree celcius.", 'UK English Female', parameters);    
+            
+}, 72000); // How long you want the delay to be, measured in milliseconds.
+
+  
 }
 
 
diff --git a/style.css b/style.css
index a039244..f2aa22e 100644
--- a/style.css
+++ b/style.css
@@ -17,11 +17,11 @@ a:hover, a:active, a:focus{
 }
 
 body{
-  background-color: #F4F6F7;
+  background-color: violet;
 }
 
 #wrapper {
-  background-color: #28688C;
+  background-color: indigo;
   box-shadow: 1px 5px 25px 3px #444;
   border-radius: 10px;
   margin: 100px auto;
@@ -46,7 +46,7 @@ body{
 
 .day-weather-box {
   border: 1px solid #28688C;
-  background-color: #2E7FA1;
+  background-color: teal;
   border-radius: 5px;
   height: 5em;
 }