Lounge Weather

Developer
Christian Östman
Size
3,357 Kb
Views
26,312
  1. Lounge Weather Previews
  2. Lounge Weather HTML Codes
  3. Lounge Weather CSS Codes
  4. Lounge Weather JS Codes

How do I make an lounge weather?

Listen to the current weather report for your location over a soft house beat. Perfect for the loungy feeling. Tested in Chrome desktop.. What is a lounge weather? How do you make a lounge weather? This script and codes were developed by Christian Östman on 11 September 2022, Sunday.

Lounge Weather Previews
IQ Test

Lounge Weather - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Lounge Weather</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="main-container"> <div class="main wrapper clearfix"> <h1 id="info" style="width:100%; text-align:center">Finding your location</h1> </div>
</div>
<audio id="music" src="//dl.dropboxusercontent.com/u/2124542/loungeWeather/assets/finnebassen.mp3" autoplay loop volume="0.1" /> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='http://maps.googleapis.com/maps/api/js?key=AIzaSyDY0kkJiTPVd2U7aTOAwhc9ySH6oHxOIYM&sensor=false'></script> <script src="js/index.js"></script>
</body>
</html>

Lounge Weather - Script Codes CSS Codes

body { font: 16px/26px Helvetica, Helvetica Neue, Arial; color: white; background-color: #000000; background: url(//dl.dropboxusercontent.com/u/2124542/loungeWeather/img/lounge.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;
}

Lounge Weather - Script Codes JS Codes

var lat;
var long;
var music = document.getElementById("music");
music.volume = 0.7;
var info = document.getElementById("info");
var wData;
var msg;
var text;
var textTomorrow;
var isSpeaking = false;
getPosition();
var voices = ["Hysterical"]
var voiceIndex = 0;
function getPosition() { if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(function(pos) { lat = pos.coords.latitude; long = pos.coords.longitude; console.log(pos) loadWeatherData(); } ); } else { info.innerHTML = "Geolocation is not supported by this browser."; }
}
function loadWeatherData() { info.innerHTML = "Loading data" $.getJSON("https://api.forecast.io/forecast/344a023d2e7596bab86444dc8a0eb376/" + lat + "," + long + "?callback=?", function(data) { wData = data; createWeatherReport(); });
}
function createWeatherReport() { info.innerHTML = "Loading voices" console.log(wData); var date = new Date(wData.currently.time * 1000); // date.toDateString() + text = " The current temperature is," + wData.currently.temperature + ", degrees fahrenheit . . . . . . " + "Todays weather will be., " + wData.currently.summary + ". . . " + wData.currently.summary + ", , . " + wData.currently.summary; textTomorrow = "Tomorrows weather will be:, " + wData.daily.data[1].summary + ". " + "With a max temperature of" + wData.daily.data[1].temperatureMax + ", degrees fahrenheit"; textSummary = " . . . . " + wData.daily.summary + ". " + wData.daily.summary; console.log(text); initVocals();
}
function initVocals() { voices = speechSynthesis.getVoices(); msg = new SpeechSynthesisUtterance(); window.speechSynthesis.onvoiceschanged = function(e) { if (!isSpeaking) { speakSequence(); setInterval(speakSequence, 75000); info.innerHTML = "Playing" getCity(); } };
}
function getCity() { var geocoder; geocoder = new google.maps.Geocoder(); var latlng = new google.maps.LatLng(lat, long); //alert("Else loop" + latlng); geocoder.geocode({ 'latLng': latlng }, function(results, status) { //alert("Else loop1"); if (status == google.maps.GeocoderStatus.OK) { if (results[0]) { var add = results[0].formatted_address; var value = add.split(","); count = value.length; country = value[count - 1]; state = value[count - 2]; city = value[count - 3]; console.log(results[0].formatted_address) console.log(results[0]) info.innerHTML = city + ", " + results[0].address_components[2].long_name + ", " + country; } else {} } else { //document.getElementById("location").innerHTML="Geocoder failed due to: " + status; //alert("Geocoder failed due to: " + status); } });
}
function speakSequence() { setTimeout(function() { speak(text, "Trinoids"); }, 3000); setTimeout(function() { speak(textTomorrow, "Trinoids"); }, 25000); setTimeout(function() { speak(textSummary, "Trinoids"); speak(textSummary, "Trinoids"); speak(text, "Hysterical"); }, 40000); //info.innerHTML = "Playing"
}
function findloc() { if (google.loader.ClientLocation) { info.innerHTML = google.loader.ClientLocation.address.city + ", " + google.loader.ClientLocation.address.country; } else { }
}
function speak(text, preferredVoice, rate) { msg.voice = speechSynthesis.getVoices().filter(function(voice) { return voice.name == preferredVoice; })[0]; msg.rate = ".6"; msg.pitch = ".3" console.log(speechSynthesis.getVoices()) msg.text = text; window.speechSynthesis.speak(msg); isSpeaking = true;
}
Lounge Weather - Script Codes
Lounge Weather - Script Codes
Home Page Home
Developer Christian Östman
Username chribbe
Uploaded September 11, 2022
Rating 3
Size 3,357 Kb
Views 26,312
Do you need developer help for Lounge Weather?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Christian Östman (chribbe) Script Codes
Name
Random 3D Landscape - camping trip
Animated SVG Snail 1
Fire particles PIXI
Famo.us tilt-shift demo without Famo.us
Apartment life
The Fish
A Small Island
Animated SVG Worm
The Rope with Youtubevideo
Create JS Template
Create amazing blog posts with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!