jQuery plugins - Weather Widget
aug 25

Weather Widget

Időjárás widget jQuery-vel

Verzió: nincs adat
Kiadás dátuma: 2009/11/24
Fejlesztő: myphpetc
Liszensz: nincs adat

Bevezető

Ez a plugin első nekifutásra kicsit értelmetlennek tűnhet. Mert mit is tud valójában? Megmondja, hogy milyen az időjárás ott, ahol épp vagy. Azonban ezek az információk nem minden esetben pontosak, meg amúgy is: elég csak kinézned az ablakon, hogy pl. megtudd, esik-e az eső.

Talán ha képes lenne időjárás előrejelzésre, akkor még lehetne valami értelme is, de enélkül valljuk be, nem sok van... Mindezek ellenére felkerült az oldalra. Hogy miért? Mert egy kis .js-buherával valami értelmeset is ki lehet belőle hozni. Először azonban némi ismertető a plugin működéséről:

Az aktuális időjárás jelentéshez két JSON lekérést használ:
A www.geoplugin.com oldalról lekérdezi a látogató aktuális földrajzi helyzetére vonatkozó információkat, majd ezeket felhasználva a www.geonames.org oldalról lekéri az adott hely aktuális időjárás jelentését.

És mit lehet belőle kihozni?

Lehet, valaki így, gyári formában is hasznát tudja venni ennek a plugin-nak, de szerintem (ahogy fentebb már kifejtettem) nem sok értelme van az egésznek. Azonban mennyivel másképp festene a dolog, ha nem a látogató aktuális földrajzi helyére vonatkoztatva jelenítené meg az időjárás jelentést, hanem mondjuk paraméterből mi adhatnánk ezt meg. Ilyen módon a plugin igen hasznos lehetne pl. üdülőhelyek, különböző turisztikai látványosságok, esetleg városok, faluk honlapján, hisz információt adhatnánk azoknak, akik szeretnének tisztában lenni azzal, hogy ahova utazni szeretnének, ott milyen az aktuális időjárás.

De ez persze itt mind csak "HA". Legalábbis félig. Ugyanis bár a plugin-t nem tudjuk paraméterekkel befolyásolni, azonban ha a .js-ben kiiktatjuk azt a részt, amely a látogató aktuális földrajzi helyzetét igyekszik kideríteni és helyette fix értékeket adunk meg, akkor befolyásolhatjuk a widget működését.

A plugin módosításáról bővebben a demo oldalán találsz információkat.

Implementálás

CSS

            <link type="text/css" rel="stylesheet" href="styles.css" media="screen" />
          

JavaScript

            <script type="text/javascript" src="js/jquery.js"></script>
            <script type="text/javascript" src="js/weather.js"></script>
            <script type="text/javascript" src="js/jquery.cookie.js"></script>
          

Hogy ne kelljen az oldal minden újratöltésénél annyi lekérést végrehajtani, a plugin a szükséges adatok tárolásához a jQuery-plugins.hu oldalon már bemutatott jQuery cookie plugin-t használja.

Használat

A használat igen egyszerű, mindössze egy megfelelő azonosítóval (weather_widget) ellátott div blokkot kell létrehoznunk, amelynek aztán a kinézetét a CSS-ben módosíthatjuk:

            <div id='weather_widget'></div>
          

Tippek

  • Természetesen a Weather widget nem tud magyarul és sajnos paramétereken keresztül sem lehet magyarosítani, így a honosításhoz a .js kódba kell alámerülnünk. Ez a művelet nem lehetetlen, csak idő igényes.
  • A widget képpel is szemlélteti az aktuális időjárási viszonyokat. Ezek a képek nem képezik részét a letölthető plugin-nak, valamint CSS-ből sem módosíthatóak. Ha mégis szeretnénk saját képeket használni a plugin-ban, akkor szintén a .js-buhera az egyetlen megoldás
    (amúgy a plugin a Google időjárás moduljának képeit használja).