Spitzohr Web Development

I’m working on a solution to automatic refresh the activity stream on a buddypress website.

The easiest way would be to replace the existing activty stream through the new loaded html code. Unfortunately, the page flickers. Also if the user reply to an update, his text will disappear.

Okay, I only should add the new updates. So I’ve added a var “existing_ids” to my javascript and pass the IDs to my php script via AJAX. My php script return only the updates where the ID is not in the list.

This works fine. But still having the problems with replies/comments to existing posts. My current solution check, if the update has comments and also write them into a var “ids_with_comments”. My php script checks, if the ID does not exists yet on the page OR the ID is not in the var “ids_with_comments” AND now has comments. The JavaScript which handle the response checks, if this is an existing update, but with new comments. It will replace the update. Only if the user is currently replying to this update, the script will do nothing. So I prevent to override the textarea.

The current scripts a part of my theme. I’ve packed the files to Theme, which is using the bp-default templates. Here you can  download the current version of my automatic-refresh theme.

Ich scripte eigentlich nur sehr selten in JavaScript. Das ist für mich nur eine Erweiterung in Browsern, um kleine Gimmicks in Websites hinzuzufügen. Als ich dann aber vor einiger Zeit das JavaScript Framework Mootools entdeckt habe, hat sich mein Ansicht von JavaScript grundlegend geändert.

Okay, ich scripte immer noch nicht in JavaScript. Ich füge auf Basis von Mootools Funktionalität hinzu, welches die Nutzung der Website angenehmer macht. Natürlich funktioniert alles auch ohne JavaScript bzw. Mootools. Mit geht es aber deutlich schöner.

Jetzt ist Mootools natürlich nicht das einzige JavaScript Framework. Es gibt da eine ganze Menge. Zu den beliebtesten zur Zeit zählt wohl jQuery (hat nichts mit Joomla zu tun…). Aber auch Dojo Toolkit und Prototype bzw. dem auf Prototype basierenden Scriptaculous sind weit verbreitet.

Mit den Frameworks kann man weitere Erweiterungen aufbauen – bzw. fertige nutzen. Wie beispielsweise die “Lightbox” (der Effekt, dass die Seite abdunkelt und in der Mitte das angeklickt Bild größer angezeigt wird). Lightboxen gibt es für jedes Framework.

Nur habe ich jetzt ein kleines Problem. In einer meiner Wordpress-Installationen verwende ich Mootools für ein Formular – welches jedoch nicht mehr funktioniert, sobald ich die Lightbox (auf Basis von Scriptaculous) aktiviert habe. Ich vermute, dass sich hier die beiden Frameworks gegenseitig blockieren.

Wie kann man das jetzt lösen? Ich will beide Funktionalitäten erhalten. Also muß ich entweder die Lightbox durch eine andere ersetzen oder mein Formular umprogrammieren…

Was verwendet eigentlich Wordpress? Ein Blick in das /wp-includes/js/ Verzeichnis verrät es mir. Hier finde ich Dateien von prototype, jQuery und scriptaculous. Im Moment tendiere ich daher, mein Formular mit jQuery oder mit scriptaculous zu überarbeiten…

Formulare erstellen macht mit den MooTools richtig viel Spass. Man kann relativ einfach Felder verschwinden lassen, wenn bestimmte Kriterien zutreffen – oder halt auch wieder erscheinen. Eine Liste läßt sich leicht erweitern. Und alles geht schön sanft.

Allerdings muß ich dazu sagen, dass ich noch sehr grob rumscripte. Das ginge auch schöner. Jedoch mit dieser Forschen und Ausprobieren-Methode lerne ich relativ schnell viele neue Möglichkeiten kennen. Später mal, kann ich diese Fähigkeiten strukturiert und sauber anwenden. So, jetzt aber mal weiter ausprobieren.