Leider kann man sich bisher nur per Invite einladen lassen. Ich würde mir das gerne mal ansehen.

Via: Create or die! – Testlauf? Twitter-Nutzer berichten von Werbeeinblendungen

Eine andere Meldung lass ich bei “Create or Die“: Unter MySpass.de stellt die Brainpool TV GmbH mehrere ihrer Produktionen gratis ins Netz. Darunter Sendungen wie Stromberg, Pastewka, Elton vs. Simon, Rent a Pocher und weiteres.

Seit einer Weile gibt es jetzt neue Werbeformate – im Kurzüberblick:

- Partial Overlay (Ein Teil des Videos (unteres Drittel) wird mit einem kleinen Banner überdeckt und kann vom Benutzer weggeklickt werden.)

- Slideout (Seitlich scrollt eine Werbefläche über das Video wenn der Benutzer die Maus darüber bewegt.)

- Slideout mit Teaser (Wie das Slideout allerdings bewegt sich zuvor eine kleine Grafik über das Video und erst bei Klick klappt das Slideout aus.)

Die Werbeformate lassen sich über das Panel konfigurieren. Beispiele zu den neuen Formaten gibt es im Blog von Captain Ad. Die Bezahlung hat sich nicht geändert: Captain Ad zahlt pro 1000 Einblendungen 3,00 Euro und 7,50 Euro pro geworbenen Benutzer der min. 1000 Einblendungen erzeugt hat.

Bisher gefällt mir Captain Ad bei meinem Test ganz gut. Ein positiver Nebeneffekt ist, dass man einen groben Einblick bekommt wie oft eigentlich ein Video auf der eigenen Seite angeschaut wird. Lohnen dürfte sich das also für Leute die häufiger mal Videos einbinden (z.B. im eigenen Blog) oder für z.B. Foren bei dem man dem Nutzer die Möglichkeit gibt Videos von diversen Videoseiten einzublenden.

Weitere Informationen: Captain Ad

Captain Ad blendet in eingebetteten Videos diverser Video-Anbieter Werbung ein. Bezahlt wird einem Publisher derzeit per TKP (Tausender-Kontakt-Preis) von 3,00 Euro.

Laut FAQ werden derzeit eine relativ große Anzahl von Video-Playern unterstützt (YouTube, Google Video, MySpace Video, Dailymotion, Sevenload, Revver, Brightcove, Break, LiveLeak, MetaCafe und lustich.de).

Ich bin mal gespannt wie sich das so entwickelt auf der Seite. Die Werbung selbst empfinde ich als relativ wenig nervig, da sie sich mit einem Klick ausblenden lässt bzw. sich selbst nach kurzer Zeit auch ausblendet.

Weitere Informationen: Captain Ad

Auch die Flaggen-Icons sind sehr schön und auf vielen Internetseiten vertreten. Sie sind sogar Public Domain (Mach wirklich was auch immer du willst damit). 247 Stück gibt’s davon. Auch, ebenfalls, sehr empfehlenswert!

Dann kommen Tokio-Hotel Fans. Zu 90% auf der Suche nach Stundenpläne. Liebe Fans, werdet doch mal selbst kreativ, besorgt euch Tokio-Hotel Bilder oder scannt Bilder, macht selber Fotos auf Konzerten oder was weiß ich und bastelt daraus einen Studenplan – das ist kreativ und man hat einen Stundenplan den sonst keiner hat

Neben den Tokio-Hotel-Fans kommen auch ganz viele Hasser, die nach "Anti Tokio Hotel" und "tokio hotel aussterben" suchen. Warum steckt Ihr so viel Energie in Hass und was erwartet Ihr auf den Seiten, die Ihr sucht? Steckt eure Energie doch mehr in produktive Dinge, bastelt vielleicht auch mal nen Stundenplan

Eine neue Kategorie von Fans verirrt sich dann auch hier her – auf der Suche nach Verliebt in Berlin – oder VIB (hab ich diese Abkürzung jemals benutzt?). Auch – größtenteils – auf der Suche nach Stundenplänen und auch sonstigen Informationen.

Zum Schluß noch die übliche Beantwortung einiger Suchanfragen: 

• anti ajax

Anti ist evtl. das falsche Wort, wie wäre es mit Nachteilen?

• web 3.0

Du bist eindeutig zu früh dran und wenn es irgendwo schon irgendwas geben sollte, dass sich Web 3.0 nennt, dann ist es wohl ganz billiges Marketinggeblubber, wo jemand auf den Web 2.0 Zug aufspringen will.

• tokio hotel chords

Also ich habe mich auch mal an der Gitarre versucht – "früher". Jedenfalls kenne ich von damals noch OLGA. Vielleicht hilft's ja.

• php objektorientiert

Wenn man mit PHP objektorientiert programmieren will, dann fängt man am besten mit dem Manual an, dort gibt es zwei interessante Abschnitte:

Kapitel 18 – Klassen und Objekte
Kapitel 19 – Klassen und Objekte (PHP 5)

• nervige flash popups

Ja, die finde ich auch ziemlich nervig. Ich empfehle JavaScript abzuschalten, damit werden die meisten Flash-PopUps erst aktiv. Siehe dazu auch den nächsten Punkt.

•  "javascript auf knopfdruck aktivieren un

Da fehlt wohl was beim Suchtext. Nun Ja. Ich benutze Firefox und da gibt es eine Extension NoScript, die genau das bietet: JavaScript ein und ausschalten auf Knopfdruck aber noch viel besser noch zusätzlich eine Whitelist der man mit 2 Klicks die aktuelle Seite zufügen kann und die dann berechtigt ist JavaScript-Code auszuführen. So kann man allen unbekannten Seiten direkt die Ausführung verbieten und bei bedarf eine Seite freischalten – auch nur temporär bis zum schließen des Browsers.

So, das war's erstmal für heute  

XajaxResponse Methoden zur Manipulation von Inhalten

In den Beispielaufrufen habe ich einige Standardwerte benutzt, die für folgendes stehen sollen:

id => Die ID eines HTML-Elements, die mit dem id-Attribut zugewiesen wurde, z.B. <div id="meineID">..</div>

attribut => Ein Attribut eines HTML-Elements, also z.B. innerHtml, value oder size (..)

text => Ein beliebiger Text oder HTML-Code, der irgendwo eingesetzt, ersetzt, etc.. wird.

script => Beliebiger JavaScript-Code.

URL => Eine URL

addAssign
Ein Attribut verändern
$response->addAssign("id", "attribut", "text");

addAppend
Weitere Daten anhängen
$response->addAppend("id", "attribut", "text");

addPrepend
Weitere Daten vorne anhängen
$response->addPrepend("id", "attribut", "text");

addReplace
Daten (teilweise) ersetzen
$response->addReplace("id", "attribut", "alter_text", "neuer_text");

addScript
JavaScript-Code hinzufügen
$response->addScript("script");

addClear
Leert den Inhalt eines Attribut
$response->addClear("id", "attribut");

addAlert
Eine JavaScript Alert-Box anzeigen
$response->addAlert("text");

addRedirect
(JavaScript-) Weiterleitung an eine andere URL
$response->addRedirect("url");

addRemove
Entfernt ein Element
$reponse->addRemove("id");

addCreate
Erzeugt ein neues Element innerhalb des Elements der zuerst angegebenen ID.
$response->addCreate("elternID", "neuesElement", "neueID");
$response->addCreate("haus", "div", "tuer");

addInsert
Ein Element vor einem anderen Element einfügen
$response->addInsert("vorID", "element", "id");

addInsertAfter
Ein Element hinter einem anderen Element einfügen
$response->addInsertAfter("vorID", "element", "id");

addIncludeScript
Eine JavaScript-Datei einfügen
$response->addIncludeScript("datei/url");

Nützliche Xajax-Methoden

Die Methoden debugOn(); und debugOff(); sind hilfreich für das Debugging. Dadurch, dass Xajax einen
Großteil der nötigen Aufgaben übernimmt weiß man evtl. nicht mehr an welcher Stelle
ein Problem eintritt. Mit aktiviertem Debug-Modus informieren Alert()-Boxen über jeden
Ausführungsschritt und Fehler lassen sich besser finden.

Mit der Methode setLogFile(); können die Meldungen auch in einer Datei gespeichert werden.

Um den Code sauber zu trennen möchte man eventuell Funktionen auslagern. Mit der
Methode registerExternalFunction(); können Funktionen aus anderen Dateien benutzt werden ohne
dass diese erst per include verfügbar gemacht werden müssen. Xajax fügt den entsprechenden
Code dann dynamisch ein wenn die Funktion gebraucht wird.
$xajax->registerExternalFunction("funktionsname", "datei.php");

Mit registerCatchAllFunction(); kann eine CatchAll-Funktion definiert werden, die immer aufgerufen wird,
wenn Xajax eine registrierte Funktion nicht finden kann und kann somit auch benutzt werden um dynamisch
auf Anfragen zu reagieren die nicht vorher genau definiert sind.

In den bisherigen Beispielen wurde printJavaScript(); zur Ausgabe des JavaScript-Codes
benutzt. Möchte man den JavaScript-Code nicht direkt ausgeben sondern in einer Variable vorliegen haben
um beispielsweise ein Template-System zu benutzen, dann erfüllt getJavascript(); diese Aufgabe.

<?php

    include("xajax.inc.php");

    $xajax = new xajax();

    function login($data) {
        // (1) formular daten
        $user = $data['user'];
        $password = $data['password'];
        $response = new xajaxResponse();

        // (2) login …

        if($loginSuccess) {
            // (3) login erfolgreich
            $response->addAssign("inhalt", "innerHtml", "Hallo ".$username."!");
        }
        else {
            // (4) login nicht erfolgreich
            $response->addAssign('info', 'value', 'Login fehlgeschlagen!');
            $response->addAssign('submitButton', 'value', 'Nochmal');
            $response->addAssign('submitButton', 'disabled', false);
            $response->addAssign('userInput', 'disabled', false);
            $response->addAssign('userPassword', 'disabled', false);
        }

        return $response->getXML();
    }

    $xajax->registerFunction("login");

    $xajax->processRequests();

?>

<html>
    <head>
        <title>ajax mit xajax</title>
        <? $xajax->printJavascript(); ?>
        <script type="text/javascript">
            function doLogin() {
                // (5) Formular lokal manipulieren und abschicken
                xajax.$('submitButton').value = 'Bitte warten…';
                xajax.$('submitButton').disabled = true;
                xajax.$('userInput').disabled = true;
                xajax.$('userPassword').disabled = true;
                xajax_login(xajax.getFormValues("loginForm"));
                return false;
            }
        </script>
</head>
<body>
    <div id="inhalt">
        <span id="info"> </span><br />
        <form onSubmit="doLogin()" id="loginForm">
            Benutzer:
            <input type="text" name="user" id="userInput"><br />
            Passwort:
            <input type="password" name="password" id="passwordInput"><br />
            <input type="submit" value="Login" id="submitButton">
        </form>
    </div>
</body>
</html>

Was passiert diesmal? Wir definieren abermals eine PHP-Funktion, diesmal mit dem Namen "login". Diese Funktion bekommt einen Parameter übergeben (data), der unsere Formulardaten enthält. Woher diese kommen schauen wir uns später an. In (1) übernehmen wir die Logindaten aus dem Array in lokale Variablen und erzeugen das Response-Objekt.

In (2) würde der eigentliche Login stattfinden, bspw. eine Datenbank zu den Daten abgefragt werden. Dieser Teil ist nicht im Beispiel, weil dies mit Ajax selbst nichts zu tun hat. Im weiteren Verlauf wird angenommen, dass der Login-Teil eine Variable $loginSuccess auf true setzt für einen erfolgreichen Login und auf false für einen nicht erfolgreichen Versuch.

War der Versuch also erfolgreich, dann setzen wir in (3) den Inhalt unseres <div> mit der id "inhalt" auf "Hallo $username!". In (4) geben wir, falls der Login nicht erfolgreich war, eine Fehlermeldung in ein Extra-Element mit der id "info". Anschließend wird das Formular zurückgesetzt, wofür genau, dafür schauen wir uns am besten jetzt mal (5) an.

Dort haben wir eine eigene JavaScript-Funktion geschrieben, die mittels des onSubmit-Attribut des form-Element das Abschicken des Formulars für uns abfängt. Auf den ersten Blick scheint das ganze etwas kryptisch auszusehen, aber eigentlich rufen wir eine Funktion $() auf, die uns das xajax-JavaScript-Objekt zur Verfügung stellt. Die $()-Funktion ist eigentlich nur eine Abkürzung für document.getElementById() und liefert uns also eine Objektrepräsentation eines Elements an Hand seiner ID.

Wir holen uns also 3 Elemente: Zunächst den Submit-Button, dessen Text wir von "Login" auf "Bitte warten…" setzen. Zusätzlich deaktivieren wir ihn, damit der Benutzer nicht erneut drauf klicken kann. Dann holen wir uns die Eingabefelder für Benutzername und Passwort. Auch diese deaktivieren wir.

Schließlich rufen wir die von Xajax erzeugte Funktion xajax_login auf, die sich darum kümmert unsere login()-PHP-Funktion auf dem Server aufzurufen. Als Parameter müssen wir noch die Formulardaten als Array übergeben – dabei hilft uns wiederum eine einfache Methode des Xajax-Objekt: getFormValues(). Dieser Methode brauchen wir nur noch die ID des Formulars übergeben und den Rest übernimmt nun wieder Xajax.

Abschließend nochmal zurück zu (4). Da wir die Formularfelder und den SubmitButton deaktivieren, müssen wir diese bei einem Fehlversuch wieder aktivieren, damit der Benutzer überhaupt die Möglichkeit hat sich noch einmal einzuloggen und dies ist was Dort passiert. Statt auf "Login" setzen wir den SubmitButton-Text diesmal auf "Nochmal" und aktivieren ihn sowie die Eingabefelder wieder.

<?php

include("xajax.inc.php");

$xajax = new xajax();

function helloWorld() {
    // (1) xajaxRespone Objekt erzeugen
    $response = new xajaxResponse();
    // (2) Rueckgabe definieren.
    $response->addAssign("inhalt", "innerHTML", "Hello World!");
    // (2) XML-Code zurueckgeben
    return $response->getXML();
}

$xajax->registerFunction("helloWorld");

$xajax->processRequests();

?>
<html>
<head>
    <title>ajax mit xajax</title>
    <? $xajax->printJavascript(); ?>
</head>
<body>
    <div id="inhalt">
        <a href="#" onClick="xajax_helloWorld()">Hello!</a>
    </div>
</body>
</html>

Das Beispiel ist ähnlich wie das Erste aufgebaut, deshalb schauen wir uns diesmal nur an was sich innerhalb der helloWorld()-PHP-Funktion tut. Zunächst erzeugen wir in (1) ein xajaxResponse-Objekt. Dies wird wiederum alles Nötige für die Rückgabe von uns abschirmen und wir brauchen uns nur darum zu kümmern, was zurückgegeben werden soll und was sich tun soll nach dem Aufruf, das "Wie" überlassen wir Xajax.

Auf unserem Xajax-Objekt benutzen wir die Methode addAssign(). Damit sagen wir, dass wir von dem HTML-Element mit der ID "inhalt" (siehe <div id="inhalt">…</div>) den inneren HTML-Code (innerHTML) durch etwas anderes (Hello World!) ersetzen möchten. Anschließend geben wir mit der Methode getXML() den nötigen XML-Code zurück. Den wird Xajax auf der Client-Seite annehmen und die entsprechenden Änderungen ausführen.

Was passiert also im Beispiel? Im div-Element mit der ID "inhalt" ist ein Link mit dem Titel "Hello", der beim Aufruf über die oben genannte Kette ersetzt wird durch den Text "Hello World!"

Seit Xajax 0.2 ist eine Rückgabe mit der getXML-Methode return $response->getXML(); nicht mehr nötig und es reicht direkt das Response-Objekt zurückzugeben return $response;

Nachdem Teil 1 eine kurze Einführung in Ajax war, gibt es jetzt in Teil 2 endlich ein wenig Code zu sehen. Und los geht's
<?php

    // (1) xajax einfuegen
    include("xajax.inc.php");

    // (2) xajax objekt erzeugen
    $xajax = new xajax();

    /**
     * (3)
     * Eine "normale" PHP-Funktion, die spaeter mittels
     * JavaScript im Hintergrund aufgerufen werden soll
     */
    function doMagicAjax() {
        // code
    }

    // (4) funktion "registrieren"
    $xajax->registerFunction("doMagicAjax");

    // (5) "ajax-anfragen" bearbeiten
    $xajax->processRequests();

?>
<html>
<head>
    <title>ajax mit xajax</title>
<?
    // (6) noetigen javascript code ausgeben
    $xajax->printJavascript();
?>
</head>
<body>
    <a href="#" onClick="xajax_doMagicAjax()">Let's do some magic</a>
</body>
</html>

Der obere Code zeigt ein kleine Hülle für eine Xajax-Anwendung. In (1) fügen wir den Xajax-Code ein um in (2) ein Xajax-Objekt zu erzeugen. In (3) definieren wir eine "normale" PHP-Funktion, diese soll später über Javascript auf dem Server aufgerufen werden, oder genauer: Per XMLHttpRequest bauen wir eine Verbindung zum Server auf und sagen ihm bzw. Xajax, dass wir genau diese Funktion jetzt ausführen möchten. Darum müssen wir uns aber nicht kümmern, denn in (4) "registrieren" wir die Funktion bei Xajax und Xajax wird den entsprechenden Code selbst generieren. In (5) soll Xajax eventuell auftretende Requests bearbeiten. Das soll bedeuten, falls ein solcher XMLHttpRequest abgesetzt wird, wird wiederum die aktuelle Seite für die Bearbeitung "aufgerufen". An dieser Stelle soll Xajax die weitere Ausführung stoppen und eventuelle Anfragen bearbeiten und wenn nötig entsprechende Funktionen aufrufen. In (6) brauchen wir mittels der Methode printJavascript() lediglich den JavaScript-Code ausgeben lassen.

Im unteren HTML-Teil des Beispiels ist ein Link definiert, der bei Klick die Javascript-Funktion xajax_doMagicAjax() aufruft, dies entspricht der automatisch von Xajax erzeugten Funktion für unsere PHP-Funktion doMagicAjax(). Was also nun nur noch nötig ist, ist das entsprechende Aufrufen des Funktionsnamen mit dem Prefix xajax_ und den Rest bis zur Ausführung der PHP-Funktion übernimmt Xajax.

Bisher wird sich nicht viel tun, schließlich ist die Funktion noch leer und ohne Möglichkeit etwas Zurückzugeben und auch HTML zu manipulieren ist das noch nicht so spannend. Also schauen wir im nächsten Teil ein weiteres Beispiel an.

(Gesehen bei stackenblochen)

Was ist Ajax?

Um zu verstehen was Ajax ist und wie Ajax funktioniert, muss man erstmal wissen wie Webseiten im Netz übertragen werden. Schaut man sich im WWW eine Internetseite an, so passiert in der Kurzform folgendes: Der Browser baut eine Verbindung zum Server auf, über das HTTP-Protokoll fragt der Browser nach der entsprechenden Seite und der Server gibt den Inhalt der Seite zurück. Danach wird die Verbindung wieder getrennt. Dies passiert bei jedem Klick auf einen Link.

Das neue bei der Nutzung von Ajax ist nun, dass die Seite(n) nicht jedesmal komplett neugeladen werden müssen. Stattdessen werden mittels Javascript nur die Daten angefordert, die für die neue Seite nötig sind und anschließend wiederum mit Javascript (DOM) in die bestehende Seite entsprechend eingefügt.

Vor- und Nachteile von Ajax

Die Vorteile bei der Benutzung von Ajax scheinen offensichtlich zu sein: Die zu übertragenden Daten sind weitaus geringer – Traffic wird gespart. Weiterhin bietet das gleichzeitige senden, empfangen und manipulieren von Daten eine von normalen Anwendungen gewohnte Umgebung.

Natürlich gibt es auch Nachteile. Der Browser muss Javascript unterstützen und Javascript muss auch aktiviert sein. Ausserdem ist das Umsetzen einer Webseite mit Ajax zunächst umständlich – diverse Frameworks sollen dabei helfen. Auch Suchmaschinen können mit Javascript und somit auch mit Ajax nicht viel anfangen.

Weiteres zu Vor- und Nachteilen bei Wikipedia

Insgesamt sollte die Ajax-Technik also nur sparsam und an der richtigen Stelle eingesetzt werden.

Xajax

Xajax ist eine Klassenbibliothek für PHP, die es ermöglicht einfach Ajax zu nutzen ohne sich großartig mit Javascript und XML zu beschäftigen. Für einfache Anwendungen braucht man praktisch nicht eine Zeile Javascript zu schreiben.

Auf Entwicklerseite werden die nötigen Funktionen in PHP geschrieben. Xajax generiert anschließend die nötigen Wrapper-Funktionen in Javascript und kümmert sich darum, dass beim Aufruf der entsprechenden JavaScript-Funktion die zugehörige PHP-Funktion aufgerufen wird.

Wie geht’s weiter?

In Teil 2 wird es dann auch ein wenig Quelltext zu sehen geben. Denn dann möchte ich ein paar Beispiele zeigen, wie man mit xajax arbeitet. Wer nicht warten kann, der kann sich auf der Xajax-Homepage das Tutorial “Learn xajax in 10 Minutes” anschauen.