 Willkommen auf dem Portal für Mediengestalter
|
|
|
| Autor |
Nachricht |
Falk Wussow
Threadersteller
Dabei seit: 13.12.2005
Ort: Wiesbaden
Alter: -
Geschlecht: 
|
Verfasst So 15.01.2006 01:20
Titel [tutorial] countdown mit flash |
  |
|
ich kam heute auf die grandiose idee, den start meiner neuen website mit einem countdown anzukündigen - da es eine flash-seite wird, wollte ich das natürlich auch in flash realisieren.
also stellte ich mich selbst vor die allseits beliebte frage "wie bau ich in flash einen funktionierenden countdown?"
vorüberlegung
flash kann nur die zeit vom computer des betrachters auslesen. bei einem australier wäre also der countdown 9 stunden vor einem deutschen beendet und in amerika liefe der countdown dann noch weitere 9 stunden. also muß eine feste zeit her.
20 minuten kopfzerbrechen und eine tasse heißen zitronengranulat-tee später kam ich drauf ... php liefert mir die zeit des servers, auf dem die website liegt. also lese ich diese aus und übergebe sie per flashvars an flash.
die zwei wichtigen dateien habe ich countdown.php und countdown.swf genannt. wie man eine swf-datei in webseiten einbindet, erkläre ich jetzt nicht - das wird oft genug beschrieben 
1. zeit-auslesen in der countdown.php
| Code: | <?
$serverzeit = (time() + 1) * 1000;
$zielzeit = mktime(9,0,0,1,16,2006) * 1000;
?> |
serverzeit ist die zeit des servers. ich habe hier noch das laden der flash-datei von etwa 1 sekunde berücksichtigt - kann man aber auch weglassen. zielzeit ist das ende des countdowns (hier: 09:00.00 am 16.01.2006).
die unix-timestamps rechne ich jeweils mal 1000, weil php in sekunden, flash aber mit millisekunden rechnet. so umgehe ich die formelbastelei in flash...
2. variablen per flashvars übergeben
| Code: | | zeitnahme=start&serverzeit=<? echo $serverzeit; ?>&zielzeit=<? echo $zielzeit; ?>"> |
wie das mit den flashvars genau funktioniert, steht in der flash-hilfe. wichtig ist, daß man die flashvars im object- UND im embed-tag einbindet ... sonst gibt es probleme mit diversen browsern. außerdem sollte loop auf true stehen, damit der countdown auch brav weiter zählt 
den sinn der variablen zeitnahme erkläre ich im actionscript-teil
3. neue flash-datei anlegen
in flash wird eine neue datei angelegt. die gestaltung ist ganz euch überlassen. da ich lediglich den countdown haben wollte, beschränke ich mich auf die einfachste variante.
die framerate auf 2 bilder pro sekunde stellen und auf der bühne ein dynamisches textfeld einzeichnen. diesem textfeld wird die variable countdown zugewiesen.
in der zeitleiste auf der einzigen ebene mit rechts ins zweite bild klicken und im kontextmenü "bild einfügen" wählen, damit zwei bilder belegt sind. nun auf das erste klicken und F9 fürs actionscript drücken. da kommt jetzt die folgende lustige programmierarbeit rein
4. das actionscript
| Code: | var clientzeit = new Date();
clientzeit = clientzeit.getTime();
if (zeitnahme != "stop") {
zeitunterschied = clientzeit - serverzeit;
zeitnahme = "stop";
} else {
realtime = clientzeit - zeitunterschied;
if (realtime >= zielzeit) {
getURL("http://www.irgend-ne-sei.te","_top");
} else {
restzeit = Math.abs(zielzeit - realtime);
countdown_h = Math.floor(restzeit / 3600000);
countdown_m = Math.floor((restzeit / 60000) - (countdown_h * 60));
countdown_s = Math.floor((restzeit / 1000) - (countdown_h * 3600) - (countdown_m * 60));
if (countdown_h < 10) countdown_h = "0" + countdown_h;
if (countdown_m < 10) countdown_m = "0" + countdown_m;
if (countdown_s < 10) countdown_s = "0" + countdown_s;
countdown = countdown_h + ":" + countdown_m + ":" + countdown_s;
}
} |
als erstes wird der variable clientzeit der typ date zugewiesen (sonst schnallt flash nicht, was man von ihm will). dann wird die uhrzeit auf dem rechner des betrachters abgefragt und in der variable clientzeit abgelegt.
jetzt kommt der uhren-vergleich von server- und clientzeit. hier taucht auch die ominöse variable zeitnahme auf. da die serverzeit nur einmal vom php-script ausgegeben wurde, die clientzeit sich aber immer ändert, darf man den unterschied nur ein einziges mal bestimmen. aus den flashvars kam ja die zeitnahme mit dem wert "start" und hier wird sie in "stop" umgeschrieben. somit wird der uhrenvergleich bei den nächsten durchläufen übergangen.
realtime ist die echte uhrzeit. sollte die uhr des betrachters tatsächlich anders gehen als die server-uhr, wird hier immer der versatz mit eingerechnet. wenn die zielzeit kleiner ist als die echte zeit (also wenn der countdown bereits abgelaufen ist), soll der browser die angegebene seite aufrufen. wenn nicht, wird die restzeit berechnet und in eine positive zahl verwandelt.
dann errechne ich aus der restzeit die restlichen stunden, minuten und sekunden. wenn die zahlen kleiner als 10 sind, füge ich noch eine führende null an und fasse die zahlen in der variable countdown zusammen. der inhalt dieser variable wird im dynamischen textfeld angezeigt.
da ich nicht der beste programmierer bin, gibt's hier sicherlich ein paar schönheitsfehler auszubügeln ... ich lass mich gerne belehren
edit: code konnte um eine zeile abgespeckt werden 
Zuletzt bearbeitet von Falk Wussow am So 15.01.2006 03:45, insgesamt 2-mal bearbeitet
|
|
| |
   |
 |
JanG
Dabei seit: 13.10.2002
Ort: Köln/Düsseldorf
Alter: -
Geschlecht:
|
Verfasst So 15.01.2006 03:12
Titel
|
|
|
Ich bin auch kein PJ, äh Coderfreund, aber wieso die framerate auf 2bps stellen? Hat das nen Sinn... Würd mich mal interessieren. Ansonsten bleibt mir nur zusagen > Counter mit echtzeit findet man bestimmt auch im Flashforum. Würd ich fast meine Eier für ins Feuer legen... 
Peaze!
Zuletzt bearbeitet von JanG am So 15.01.2006 03:12, insgesamt 2-mal bearbeitet
|
|
| |
|
|
|
Anzeige
|
|
|
Falk Wussow
Threadersteller
Dabei seit: 13.12.2005
Ort: Wiesbaden
Alter: -
Geschlecht:
|
Verfasst So 15.01.2006 03:38
Titel
|
|
|
2 bilder pro sekunde macht bei zwei bildern einen durchlauf pro sekunde ... wozu also mit 24 bps die performance für nen dämlichen countdown verbrauchen?
im flashforum hab ich ne gute stunde gesucht aber nix gefunden ... daher kam ich ja erst ins grübeln. die hatten dort nur eine echtzeit-variante, wo alle 720 frames eine php-seite neu geladen wurde, aus der die servertime ausgelesen wurde. das wollt ich einfach umgehen ... zumal flash ja nicht wirklich 24 bps schafft, nur weil man's angegeben hat ... da kommt der andere countdown schnell mal durcheinander
|
|
| |
|
|
JanG
Dabei seit: 13.10.2002
Ort: Köln/Düsseldorf
Alter: -
Geschlecht:
|
Verfasst So 15.01.2006 03:42
Titel
|
|
|
Das mit dem Flashforum und "nichts gutes gefunden" ist komisch... Aber ok... Und das mit den 2 bps (die laufen doch die ganze zeit durch, oder ned) ist denk ich nicht grad soviel performancefreundlicher als bei 24bps... Laufen ist laufen, egal wie langsam und wenn da nur 2frames sind, springt der dann echt nur jede halbe Sekunde ins nächste frame (teste ich jetzt mal)... Interssiert mich wirklich.
Bin mal gespannt was PJ oder Tux zum Code schreiben.
Peaze!
Edit: Test erfolgriech... Hast Recht... Der rennt langsamer, aber ob performance spart, wäre ich mir nicht so sicher. Vielleicht wissen da P und T ja auch was zu. Haut mal rein Jungs, ihr wisst das doch bestimmt.
Zuletzt bearbeitet von JanG am So 15.01.2006 03:44, insgesamt 2-mal bearbeitet
|
|
| |
|
|
Falk Wussow
Threadersteller
Dabei seit: 13.12.2005
Ort: Wiesbaden
Alter: -
Geschlecht:
|
Verfasst So 15.01.2006 03:47
Titel
|
|
|
wenn die grafikkarte die 24 bps z.b. nicht schafft, läuft das teil nur so schnell, wie er kann. wer jetzt also sagt, daß bei 24 bps IMMER 1 sekunde vergeht, irrt sich
eine 12-bps-animation, die für die gleiche zeit ausgelegt ist, schafft es wahrscheinlich auch in der zeit
|
|
| |
|
|
l'Audiophile
Dabei seit: 16.09.2004
Ort: Berlin
Alter: 43
Geschlecht:
|
Verfasst Mo 16.01.2006 10:20
Titel
|
|
|
Nen dickes RESPEKT von mir. 
|
|
| |
|
|
Falk Wussow
Threadersteller
Dabei seit: 13.12.2005
Ort: Wiesbaden
Alter: -
Geschlecht:
|
Verfasst Mi 18.01.2006 07:46
Titel
|
|
|
COUNTDOWN 1.1
hab's noch etwas verfeinert. wenn man während der countdown-anzeige an der rechneruhr datum oder uhrzeit so einstellt, daß der countdown abgelaufen ist, würde die seite weiterspringen. jetzt soll der flash-countdown bei 00:00:00 erneut die countdown.php aufrufen. DIESE entscheidet - anhand der serverzeit -, ob die weiterleitung wirklich ausgeführt werden soll.
nun kann der countdown wirklich nur noch durch einen falschgehenden server verarscht werden
countdown.php
| Code: | <?
$serverzeit = (time() + 1) * 1000;
$zielzeit = mktime(9,0,0,1,16,2006) * 1000;
if ($serverzeit >= $zielzeit) {
header("location: http://www.irgend-ne-sei.te/sprungziel");
exit();
}
?> |
im actionscript lasse ich die echte zeit schon im ersten durchlauf errechnen. das dynamische textfeld zeigt so lange nichts an, bis die zeit berechnet ist (auf langsamen rechnern verhindert das einen anzeigefehler). außerdem hab ich vergessen, darauf hinzuweisen, die zeichen 0123456789: im dynamischen textfeld einzubetten, weil sie sonst mit standard-schrift gezeigt werden.
actionscript in countdown.fla
| Code: | var clientzeit = new Date();
clientzeit = clientzeit.getTime();
if (zeitnahme != "stop") {
countdown = "";
zeitnahme = "stop";
zeitunterschied = clientzeit - serverzeit;
} else {
realtime = clientzeit - zeitunterschied;
if (realtime >= zielzeit) {
countdown = "00:00:00"
getURL("countdown.php","_top");
stop();
} else {
restzeit = Math.abs(zielzeit - realtime);
countdown_h = Math.floor(restzeit / 3600000);
countdown_m = Math.floor((restzeit / 60000) - (countdown_h * 60));
countdown_s = Math.floor((restzeit / 1000) - (countdown_h * 3600) - (countdown_m * 60));
if (countdown_h < 10) countdown_h = "0" + countdown_h;
if (countdown_m < 10) countdown_m = "0" + countdown_m;
if (countdown_s < 10) countdown_s = "0" + countdown_s;
countdown = countdown_h + ":" + countdown_m + ":" + countdown_s;
}
} |
eben fiel mir übrigens auf, daß ich sowas wahrscheinlich nie wieder brauchen werde
Zuletzt bearbeitet von Falk Wussow am Mi 18.01.2006 07:47, insgesamt 1-mal bearbeitet
|
|
| |
|
|
JanG
Dabei seit: 13.10.2002
Ort: Köln/Düsseldorf
Alter: -
Geschlecht:
|
Verfasst Mi 18.01.2006 17:20
Titel
|
|
|
Wenn du es nicht brauchst, hier brauchen es vielleicht der ein oder andere... Kannst es ja auch mal im FF posten, da hab ich nämlich auch nur teile gefunden (wie du selber wahrscheinlich auch) *g*...
Peaze!
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
Countdown für kleinen Flash-Shooter
[flash] countdown für bestimmtes datum
Ablaufdatum für Countdown aus xml Datei lesen[Flash]
Flash einsteiger tutorial
Director und Flash Tutorial
Flash Seifenblasen Tutorial
|
|
|
Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.
|
|
