Twitter stijl reactie

Posted at August 06, 2011

You’ve found a dinosaur, this post is only here for archiving purposes. The content is outdated and is not applicable anymore.

Bloggen draait om communiceren, reactie’s spelen hier dan ook een grote rol bij. Zonder een reactie formulier onderaan je blogposts hoor je er al jaren niet meer bij, maar “threaded comments” (ofwel geneste reactie’s ala youtube) wordt toch ook steeds vaker verwacht.

Zelf vind ik twitter stijl reactie’s heel gaaf en beter bij dit blog passen: Je kan reageren op een post door gewoon het formulier te gebruiken, als je wilt reageren op iemand anders reactie klik je op reageer en wordt er automatisch een link naar die reactie toegevoegd met @[naam van poster] (test het hieronder uit op een reactie).

Ik gebruik PHP (en WordPress) om een reactie link te maken bij elke reactie, deze link krijgt een id mee die de gegevens bevat die ik nodig heb (comment id zodat ik ernaar toe kan linken en de naam van de poster). Dit id lees ik uit met jQuery en maak hier een link van en stop hem in het formulier.

PHP Elke link krijgt de klasse comment-reply-link en een uniek id mee.

Javascript Ik maak de link stuk (preventDefault) en gebruik de focus functie zodat je gelijk kan typen. (Op deze manier werkt alles ook zonder Javascript). Ik lees het id uit en stop de naam en het comment nummer in een string die ik vervolgens in het formulier (id#comment) stop.

$(document).ready(function() {
    $('a.comment-reply-link').click(function(event) {
        event.preventDefault();
        var str = $(this).attr('id').slice(6);
        var id =  str.slice(0,str.indexOf('-'));
        var name = str.slice((str.indexOf('-'))+1);
        $('#comment').val('+ id + '">@' + name + ' ' + $('#comment').val()).focus();
    });
});