Stima Soft

    M-am gandit sa fac o mica serie de post-uri referitoare la javascript in general, la jQuery in special.

    Personal, gasesc acest framework a fi unul excelent pentru fix-uri rapide, dar si pentru creare de interfete complete folosind AJAX.

    Un fix la care am apelat de curand a fost crearea unui link fara a folosi tag-ul a din html. Se poate realiza foarte usor, fara a modifica DOM-ul existent. Eu am folosit aceasta metoda deoarece nu vroiam sa modific structura DOM a documentului, pentru ca ar fi insemnat sa modific alte functii de javascript ce implementau diferite functionalitati.

    Este de la sine inteles faptul ca trebuie sa includeti framework-ul jQuery in head-ul paginii. jQuery poate fi descarcat de aici.

    In continuare voi descrie pasii ce trebuie urmati pentru a obtine acest element simulat.

HTML

<p id="simuLink">Buy design</p>


    Elementul DOM poate fi oricare altul, nu este obligatoriu sa fie p. Poate fi div, span, h, td, etc.

    Pentru a ii conferi un aspect de link acestui element, adaugam o definitie css de forma:

CSS

.simuLink {
    cursor:pointer;
    font-weight:bold;
    text-decoration:underline;
}


    Acum trecem la partea frumoasa, la implementarea functionalitatii cu ajutorul framework-ului jQuery.

JAVASCRIPT

$(document).ready(function(){
    $('p#simuLink').click(function() {
        document.location = 'http://url'; // a se edita
    });
});


    Codul javascript este destul de simplu si nu cred ca necesita explicatii suplimentare. Se observa ca prin prima linie a codului javascript, se ataseaza event-ul click elementului de tip p cu id-ul simuLink.

    Mai simplu nu se poate. Eu am gasit aceasta metoda ca fiind cea mai simpla ocolire a multor probleme legate de selectarea unui singur element a dintr-un element div, de exemplu, atunci cand trebuie sa avem mai multe link-uri in acel element div.

    Sper ca o sa va ajute acest mic truc.

Probabil ati observat pe digg ca este afisat timpul scurs de la postarea unui comentariu in urmatorul format:

Pentru a obtine un astfel de rezultat vom folosi functia strtotime. Aceasta functie numara secundele trecute de la 1 Ianuarie 1970.

Pentru a putea obtine cu exactitate numarul de secunde ar trebui sa salvam data postarii unui comentariu in urmatorul format: date(‘Y-m-d H:i:s’) – va returna 2008-11-12 14:39:53

La crearea fieldului data in tabela MySQL alegeti tipul datetime.

Incepem cu adaugarea in tabela MySQL a comentariului.

INSERT INTO `comments` (`nume` , `comentariu`, `data`) VALUES ('Sava Stefan', 'Acesta este un comentariu', NOW( ));

NOW() va insera valoarea exacta a timpului in acel moment in format 2008-11-12 14:39:53.

Acum ca avem un comentariu este timpul sa afisam timpul trecut.
Voi nota data postarii acestui comentariu cu $datacomentariu. Shtiti voi cum sa il obtineti .

Vom crea o functie numita countTime.

function countTime($datacomentariu) {
$now = date('Y-m-d H:i:s');
$nrsecunde = (strtotime($now) - strtotime($datacomentariu));
}

Pana acum am obtinut numarul de secunde ce au trecut de la postarea comentariului ($datacomentariu).
Trecem mai departe si vom afla nr de zile, ore si minute trecute prin simple operatiuni matematice.


$nrminute = $nrsecunde / (60);
$nrore = $nrminute / (60);
$nrminuteafisat = intval($nrminute - ($nroreafisat * 60));
$nroreafisat = intval($nrore);


Dupa cum vedeti numarul de minute trecute este egal cu numarul de secunde obtinut mai devreme (diferenta) impartit la 60. Numarul de ore va fi la randul sau egal cu numarul de minute impartit la 60.

Am folosit intval pentru a obtine numarul intreg de ore si minute ce vor fi afisate.

Numarul de secunde afisat va fi si el un numar intreg:

$nrsecundeafisat = intval($nrsecunde - ($nroreafisat * 60 * 60) - ($nrminuteafisat * 60));

$nroreafisat * 60 * 60 = numarul de secunde in $x ore; daca $nroreafisat = 1 vom avea 3600 de secunde
$nrminuteafisat * 60 = numarul de secunde in $x minute; daca $nrminuteafisat = 2 vom avea 120 de secunde.

Acum sa customizam putin output-ul acestei functii:
echo 'comentariu postat acum '.$nroreafisat.' ore, '.$nrminuteafisat.' minute si '.$nrsecundeafisat.' secunde';

Functia completa:


function countTime($datacomentariu) {
$now = date('Y-m-d H:i:s');
$nrsecunde = (strtotime($now) - strtotime($datacomentariu));
$nrminute = $nrsecunde / (60);
$nrore = $nrminute / (60);
$nrminuteafisat = intval($nrminute - ($nroreafisat * 60));
$nroreafisat = intval($nrore);
$nrsecundeafisat = intval($nrsecunde - ($nroreafisat * 60 * 60) - ($nrminuteafisat * 60));
echo 'Postat acum '.$nroreafisat.' ore, '.$nrminuteafisat.' de minute si '.$nrsecundeafisat.' secunde';
}


Integrarea acestei functii se face foarte simplu. $comentariu['data'] este data postarii comentariului din baza de date.

Nume: $comentariu['nume'];
Comentariu: $comentariu['comentariu'];
countTime($comentariu['data']);


Va fi afisat:


Nume: Sava Stefan
Comentariu: Acesta este un comentariu
Postat acum 3 ore, 24 de minute si 13 secunde


Bineinteles ca puteti calcula si timpul ramas pana la o anumita data scazand din data limita data curenta:
$nrsecunderamase = (strtotime($dataincauza) - strtotime($now));