English readers, check this link please, it contatins demo and download link (with english readme file) cheers!

Pre nekog vremena, kada sam radio jedan sajt, zatrebala mi je prognoza. Pokušao sam da nađem nešto gotovo što bih iskoristio, ali ništa mi nije odgovaralo. Ili je falilo opcija, ili nije moglo da se prevede, ili se plaćao…

Weather Widget Screenshot

Znate već kako to ide. Onda sam lepo seo i napisao sam mali widget, tj. plugin za JQuery.

Preporučujem da odmah pogledate demo:

Demo

Ako vam se svidelo možete odmah skinuti na linku ispod Arhiva sadrži sve potrebne fajlove, i uputstvo na engleskom jeziku. Naravno ovde ću napisati uputsvo na srpskom. I obratite pažnju da kada skinete arhivu, celu stvar morate pokrenuti pod web serverom, inače neće raditi, zbog AJAX poziva.

JQuery Weather Widget
V1.0

Download

Uputsvo i tehničke stvari

Weather Widget prikazuje trenutne vremenske uslove, i prognozu za četiri dana, za jedan ili više gradova. Ako ubacite više gradova pojaviće se select kontrola u kojoj se bira grad. Podaci se uzimaju sa Google-vog weather api-ja putem php skripte. API vraća XML koji se parsira i prikazuje.

1. Prvo prekopirajte ceo weather-widget negde na vaš server.

2. Morate imati JQuery da bi koristili ovu prognozu, pa ako ga već nemate implementiranog, samo dodajte ovu liniju u head tag stranice:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>

3. Na mestu gde prognoza treba biti prikazana ubacite sledeći kod.

<!-- Begin of Weather Widget -->
<div id="weather-widget"></div>
<!-- End of Weather Widget -->

4. Ubacite CSS i JavaScript fajlove u head tag:

<link href="weather-widget/weather-widget.css" rel="stylesheet"  type="text/css" />
<script type="text/javascript" src="weather-widget/weather-widget.js"></script>

5. I na kraju samo podesite opcije za skriptu i pokrenite je u document.ready funkciji

<script type="text/javascript">
$(document).ready(function(){
    $("#weather-widget").weatherWidget({
       language: "sr",
       cities: Array(
            "belgrade", "Belgrade",
            "paris", "Paris",
            "london", "London",
            "moscow", "Moscow",
            "10099","New York", // postal code
            ",,,43724590,19707284","Zlatibor" // coordinates (notice 3 comas)
       ),
       showForecast: true,
       showForecastString: 'Show forecast',
       hideForecastString: 'Hide forecast',
       hideCurrentConditions: true
    });
});
</script>

Lista opcija

url                     putanja do google-weather.php fajla
language                jezik u ISO formatu, za srpski koristite 'sr'
cities                  niz gradova za prognozu,
                        prvi parametar je ime, poštanski broj ili koordinate
                        drugi parametar je ime koje će biti prikazano
                             ime - "belgrade", "Beograd",
                             poštanski broj - "10099","New York"
                             koordinate (obratite pažnju na 3 zareza) - ",,,43724590,19707284","Zlatibor"
showForecast	        ako je postavljeno na false, "Show forecast" link neće biti prikazan
showForecastString      tekst za "Show forecast" link
hideForecastString      tekst za "Hide forecast" link
hideCurrentConditions   ako je postavljeno na false, trenutni uslovi neće biti sakriveni kada se prikaže prognoza

poštanski broj

To je to isprobajte, eksperimentišite, pa sve komentare, sugestije i ispravke ostavite ovde.

U zdravlje!