Wallpaper 1.0 - Wallpaper, Hockeysticks, Tandem-Banner und … jetzt auch Fireplaces
Nach mehr als einem Jahr gibt es jetzt eine neue Version der Wallpaper Klasse.
Die Wallpaper Klasse soll es Flash Designern ohne große ActionScript-Erfahrung ermöglichen, miteinander kommunizierende Banner zu produzieren. Mehr Informationen über die Vorteile und Möglichkeiten der Klasse gibt es in den Blog-Einträgen zu Version 0.2 und Version 0.3.
Ich habe die komplette Klasse jetzt von grundauf neu geschrieben, um endlich das zu erreichen, was Daniel und ich von Anfang an als Ziel hatten: eine unbegrenzte Anzahl von swfs über LocalConnection miteinander kommunizieren zu lassen. Dabei sollte die Klasse nach wie vor einfach zu handhaben sein - auch für "Nicht-Programmierer". Deshalb wurde die bekannte Syntax aus Version 0.3 für die Kommunikation von zwei swfs auch beibehalten:
-
var skyscraper:Object;
-
-
function onConnected(otherSWF:Object):Void
-
{
-
skyscraper = otherSWF;
-
skyscraper.gotoAndPlay(2);
-
}
-
-
Wallpaper.connect(this);
Für die Kommunikation mit mehreren swfs ist etwas mehr Tipparbeit notwendig:
-
Wallpaper.setup("leftSky", "superBanner", "rightSky");
-
function onConnected():Void
-
{
-
Wallpaper.ALL.gotoAndPlay(2);
-
}
-
Wallpaper.connectAs("superBanner", this);
Als erstes wird über Wallpaper.setup() die Wallpaper Klasse für die Kommunikation initialisiert. Die übergebenen Namen sind frei wählbar, müssen aber in allen kommunizierenden swfs identisch sein. Dann wird wie gewohnt die onConnected Callback Funktion definiert. Sie wird von Wallpaper aufgerufen, sobald alle beteiligten swfs eine Verbindung aufbauen konnten. Zu guter Letzt startet man die Verbindung mit der Methode Wallpaper.connectAs(), der ein Verbindungsname und eine Zeitleiste/ein MovieClip übergeben wird. Der Verbindungsname muss einer der zuvor an Wallpaper.setup() übergebenen sein. Das war schon alles, was für eine Kommunikation zwischen drei swfs notwendig ist.
Das Beispiel zeigt ein weiteres neues Feature von Version 1.0: über Wallpaper.ALL kann man Funktionen in allen verbundenen swfs gleichzeitig aufrufen. Im Beispiel werden alle drei swfs in Frame 2 springen und abspielen.
Wenn die Methoden Wallpaper.setup() und Wallpaper.connectAs() benutzt werden, wird der Callback Funktion onConnected() kein Wert übergeben. Man muss also eine Möglichkeit haben, einzelne swfs in irgendeiner Form anzusprechen. Das bietet die Methode Wallpaper.getObjectByName(). Ihr wird einer der zuvor mit Wallpaper.setup() registrierten Verbindungsnamen übergeben und gibt eine Referenz auf die Verbindung zurück. Über diese Referenz können dann wie gewohnt Funktionen im verbundenen swf aufgerufen werden. Hier ist das Beispiel von oben, mit zwei Variablen, die die Referenzen auf die anderen verbundenen swfs speichern:
-
Wallpaper.setup("leftSky", "superBanner", "rightSky");
-
var leftSky:Object = Wallpaper.getObjectByName("leftSky");
-
var rightSky:Object = Wallpaper.getObjectByName("rightSky");
-
function onConnected():Void
-
{
-
Wallpaper.ALL.gotoAndPlay(2);
-
}
-
Wallpaper.connectAs("superBanner", this);
Über die Variablennamen kann man zu einem späteren Zeitpunkt einfach Funktionen in einem verbundenen swf aufrufen:
-
leftSky.play();
Die Referenzen können zwar direkt nach dem Aufruf von Wallpaper.setup() Variablen zugewiesen werden, der Aufruf von Funktionen ist aber erst sicher, nachdem onConnected() aufgerufen wurde.
Aufgrund der erweiterten Möglichkeiten ist die Klasse jetzt etwa um etwa 700 Bytes gewachsen, aber mit ca. 1600 Byte sollte sie auch für knebelnde Vermarkter KB-Vorgaben brauchbar sein.
Im zip findet ihr neben der Klasse (natürlich in ActionScript 1 und ActionScript 2) und den üblichen Einsatzbeispielen jetzt auch ein pdf mit einer kurzen Dokumentation der Klasse.
Wie immer freuen wir uns über Anregungen, Kritik und Lob.
Download:
Wallpaper v1.0 (zip, 346.94 KB)
Wallpaper v1.0.1
Wallpaper v1.0.1b(Wichtiges Bugfix! zip, 332 KB)
Am 25. März 2008 um 10:58 Uhr
[…] Roman Hippler hat die neue Version der Wallpaper Klasse auf seinem Blog zum Download bereit gestellt: Diese ermöglicht es den eher grafisch orientierten Flashern ohne große Action-Script Erfahrung syncronisierte Wallpaper, Tandem Ads und jetzt auch - Achtung! - sogenannte Fireplaces, also eine Vielzahl kommunizierender Flashbanner, auf einfachste Weise zu erstellen und zu verketten. […]
Am 14. Juli 2008 um 10:49 Uhr
hi
erstmal danke für das geniale posting. ich habe nämlich gerade genau dieses problem, die swf’s sind fertig, aber das wallpapaer ist noch nicht synchronisiert.
auf dem mac lief das teil von dir auch ganz prima, aber der IE7 begrüßt mich mit seiner gelben Sicherheitsleiste und blockt das skript und das swf. Hast du einen Tipp wie man das umgeht?
gruß
auch roman
Am 14. Juli 2008 um 19:48 Uhr
Hi Roman,
das ist leider das normale Verhalten des IE, wenn swfs (oder andere ActiveX-Inhalte) direkt über den Object/Embed-Tag in html eingebunden werden.
Beheben kann man das Ganze, indem man das Object/Embed-Tag über JavaScript in die Seite einfügen lässt. Adobe benutzt dafür das AC_RunActiveContent.js, das mit erstellt wird, wenn man aus Flash heraus html und swf veröffentlicht.
Ich kann dir swfobject empfehlen, das mittlerweile ein Quasi-Standard für das Einbinden von swfs in html-Seiten ist.
gruß,
der andere Roman
Am 15. Juli 2008 um 10:11 Uhr
vielen dank, ich werde es so testen
Am 25. Juli 2008 um 12:00 Uhr
so, die kampagne ist fertig, das skript war kinderleicht zu implementieren und auch damit zu arbeiten, danke und respekt nochmal.
leider scheint die localconnection bei aufwändigen animationen (im browser…) nicht immer hundertprozentig (rechnerabhängig?…) zu synchronisieren, also ist da etwas vorsicht geboten
Am 26. Juli 2008 um 09:20 Uhr
Freut mich sehr, dass dir das Skript geholfen hat.
Die Synchronität ist leider wirklich abhängig von der Auslastung des Prozessors und nie hunderprozentig zu garantieren. Was bei unseren Projekten geholfen hat:
- die Banner mehrfach synchronisieren. Wenn in einem Banner keine Animation abläuft, diesen stoppen und vom anderen Banner wieder starten wenn der richtige Zeitpunkt gekommen ist.
- Nicht auf Keyframes synchronisieren, in denen neuer Inhalt auf der Bühne erscheint. Wenn Bitmaps z.B. das erste mal auf der Bühne erscheinen, braucht der Flashplayer etwas Zeit um die Bitmapdaten zu dekomprimieren und darzustellen.
- Inhalte in beiden Bannern komplett vorladen bevor das Wallpaper gestartet wird.
Am 22. September 2009 um 09:21 Uhr
Hallo Roman,
erst mal Danke für das Script.
Ich habe ein Skyscraper und ein Superbanner (728×90px) erstellt und alles so ausgeführt wie es beschrieben ist. Dafür habe ich habe das “simple_Example” benutzt. Jetzt hat mir die Firma, die die ADs schaltet geschrieben das es Probleme
je Nach Browser und Ladegeschwiendigkeit kommt. Hier der Orginal Text:
Das Problem liegt an den Werbemitteln selbst.
Es existiert eine sogenannte “local Connection” zwischen Banner und Sky.
Wenn ein Browser (je nach Version und Ladegeschwindigkeit) zu “langsam” die Seite lädt, erkennen sich Banner und Sky nicht mehr, sodaß die Animation nicht startet.
Dies ist hier der Fall.
Die “local Connaction” kann in den Werbemitteln daraufhin optimiert, bzw. korrigiert werden
Wie und Wo kann ich das Problem beheben? Ich bin nicht der AS Profi.
Es reicht gerade mal für die simpelsten Scripts.
Ich würde mich über eine Antwort freuen.
Schöne Grüße
Tino
Am 22. September 2009 um 16:01 Uhr
HI Tino,
das Problem ist so noch nicht aufgetaucht seitdem wir das Script im Einsatz haben, genaugenommen soll die Wallpaper-Klasse geanu dieses Problem verhinden.
Kontrollier doch bitte noch einmal, ob das Script genaus eingebunden ist wie im simple_Example.
Ich kann dir auch anbieten, das du mir deine Files zuschickst (mail at romanhippler dot de) und ich einen Blick darauf werfe, allerdings bin ich im Moment bei der Flash on the Beach in Brighton und bin nicht ständig online.
Beste Grüße,
Roman