Povećanje nekog iznosa u sekundi (slično kao freespace na Gmailu)

Pozdrav svima,

Čitam vas često, no iskreno, rijetko se javljam. Volio bih više sudjelovati i pomoći drugima, samo mi je bed jer vidim da većina vas najaktivnijih rastura. No, uključit ću se.

Uglavnom, malko sam kratak sa PHP-om :), a trebao bih napraviti nešto što bi moglo biti zahtjevno. Možda i nije…

Znate kako Gmail ima onaj counter free spacea koji pomalo raste svake sekunde. E htio bih i ja jedan sličan counter implementirati na svoj web. Neću reklamirati firmu, ali bavim se većim uštedama firmama u području IT-a i želio bih na web implementirati beskonačan brojač koliko je moja firma novaca uštedila svojim klijentima. Htio bih da se to povećava svake sekunde, za iznos kojeg ću ja izračunati i postaviti ga u bazu.
Također baza mora “shvatiti” u kojem je realnom vremenu, a ne da nakon svakog refresha kreće od nule.

Da sam našao neki primjer na netu, snašao bi se i sam, ali nisam. Možda nisam dobre riječi zguglao… Uglavnom, ne znam baš od kud bih krenuo… :mm:

Zapravo, da malo nadopunim.

Zamišljao sam da bi algoritam izgledao ovako nekako:

  • kad se stranica loada, server pročita trenutno vrijeme i pretvori ga u proteklo vrijeme u sekundama počevši od 1.1.2012. od 0:00:00
  • sekunde se pomnože sa nekom vrijednošću, npr. 0,20kn
  • ispiše se odmah iznos koji mi treba
  • skripta to nastavi dalje raditi svake sekunde…

Moj prijedlog ti je da tako nešto izvedeš pomoću Javascripta.

Zašto?
Javascript se izvodi na strani klijenta, a za ovakve vizualne kerefeke nije potrebno ništa više.

Kako?
Pomoću Javacript Date() objekta i njegove getTime() metode ćemo dobiti dva vremenska iznosa u milisekundama, zatim oduzet završni od početnog, pomnožiti s 0.002 i ispisati.

Što je potrebno?
Da bi kôd koji slijedi ispod funkcionirao, potrebno ga je uokviriti tagom i spremiti u dio stranice. Osim tog, potreban je i neki element u koji ćemo umetnuti rezultat, ja sam mu dodjelio ID=“result”, ali to se da promijeniti.

[php]
/* za objasnjenje ovog komada vidi ispod */
setInterval(function(){

/* pocetni datum, godina/mjesec/dan s tim da su mjeseci od 0-11 (!!)
dakle pocetni datum je 1.1.2012. */
var startDate = new Date(2012, 0, 1);
startDate = startDate.getTime();


/* zavrsni datum je trenutni */				
var endDate = new Date();
endDate = endDate.getTime();
			

/* iznos cemo izracunati kao razliku datuma pomnozenu s 0.002 */
var amount = (endDate - startDate) * 0.002;

/* B varijanta, vidi dolje */
/* var amount = Math.round((endDate - startDate) * 0.002); */


/* u element ID-ja "result" unosimo iznos i na kraj nadodajemo " kn" */			
document.getElementById('result').innerHTML = amount + ' kn';

}, 200);
[/php]

setInterval()

Jedino što preostaje za objasniti je funkciju setInterval(). Navedena funkcija prima dva parametra:
[list]
[:3a10j27h] funkciju koju će izvršiti[/:m:3a10j27h]
[:3a10j27h] vremenski interval kojim se funkcija izvodi, u milisekundama (1000ms = 1s)[/:m:3a10j27h][/list:u:3a10j27h]

Kod kompliciranijih stvari ljudi vole nazvati nekako našu funkciju, npr izracunaj() i onda nju navesti kao prvi parametar.

[php]setInterval(“izracunaj()”, 1000);[/php]

Međutim, smatram da nema potrebe za tim, tako da koristimo anonimnu funkciju koju smo jednostavno naveli kao prvi parametar.

[php]setInterval(function() {…}, 1000);[/php]

Želim znati više sekcija nalazi se na dnu.

B varijanta ispisa
Unutar komentara sam spremio i verziju koja zaokruži iznos na okrugli broj, možda je estetski ljepša. U tom slučaju nema potrebe stavljat interval manji od ~500ms jer se iznos ne mijenja.

Nadam se da je to odgovor koji si tražio :slight_smile:


Želim znati više!
Iako nije ni od kakve važnosti za funkcioniranje gore navedenog kôda, postoji bolja alternativa funkciji setInterval()! Naime, problem kod funckcije setInterval() je to što je “bezobzirna”. Funkcija će izvršiti prvi parametar u intervalu koji je naveden, bez obzira na okolnosti. To može izazvati probleme kada je interval iznimno mali, odnosno kada je potrebno izvršiti zahtjevniji kôd.

Npr, ako želimo izvršiti neki zahtjev AJAX-om, skripta mora poslati zahtjev, server mora obraditi zahtjev i vratiti rezultat, što ponekad zahtjeva malo više vremena. U tom slučaju će setInterval() ukoliko prođe navedeni interval, svejedno pokrenuti opet tu funkciju, unatoč tome što nismo dobili ni rezultat prethodnog zahtjeva. Krkljanac.

Rješenje u tim slučajevim programeri nalaze u, [size=4]uf kako bi to preveo[/size], samoizvršavajućoj anonimnoj funkciji (self executing anonymous function) i funkciji setTimeout().

Ukratko, napravi se anonimna funkcija koja izvršava određeni kôd (npr. AJAX zahtjev) i nakon tog poziva samu sebe pomoću setTimeout() funkcije i određenog intervala. Fora je u tome što, ukoliko zahtjev potraje, setTimeout() se neće aktivirati dok se prethodni kôd ne izvrši.

[size=4]Mod, može ovo u JS podforum? :)[/size]

E oprosti što još nisam rekao veliko HVALA!

Imao sam neke druge obaveze i totalno sam smetnuo s uma da sam postavio ovo pitanje. Stoga nisam ni dolazio na forum. Hvala ti na odličnom objašnjenju i baš ću ga u narednih par dana isprobati.

Pozz