17. Mai 2011 · Kommentieren · Kategorien: Internet · Tags:

Wie einige sicher wissen, stelle ich bereits seit mehreren Ubuntu-Versionen (z.B. für Ubuntu 11.10) Countdown-Grafiken zur Verfügung. Ich biete die Counter als einfache Bilder zum Einbinden an und sie erfreuen sich großer Beliebtheit – nicht nur im deutschen Sprachraum.

Bereits mehrere Male wurde ich nun danach gefragt, ob ich denn ein Tutorial zur Erstellung so eines Countdowns schreiben könnte. Nun gut, ich werds mal versuchen :-). Das Ganze hier soll keine Copy & Paste-Anleitung werden – ist auch gar nicht zielführend. Ich will den Interessierten nur ein paar Tipps und einen roten Faden geben, den Rest sollen sie gefälligst selbst herausfinden ;-).

Anzeige

Grundlegendes

Normalerweise verwende ich ein PHP-Skript um die Countdown-Grafik zu erstellen. Dieses PHP-Skript wird dann einmal pro Tag ausgeführt und erstellt täglich neue Grafiken. Neben ein paar Zeilen PHP-Code benötige ich noch meist eine Schriftart im .ttf-Format, sowie ein in GIMP erstelltes Hintergrundbild.

Bei den aktuellen Countern habe ich die Schriftart aus meinem /usr/share/fonts-Ordner genommen. Im Prinzip kann jede Schriftart verwendet werden. Als Bildgrundlage dient folgendes Bild, das ich in GIMP erstellt habe. Wie ihr seht, ist das Counter-Bild beinahe komplett. Was fehlt ist einzig und allein der Schriftzug „xxx days to go“.

 

 

Der PHP-Teil

Als erstes muss ein Stück Code her, das die Anzahl der Tage berechnet. Alle Wege führen nach Rom und hunderte Wege führen zur richtigen Differenz. Hier eine Möglichkeit, wie man es machen kann.

function getDaysTo($ende) {
	$heute = date("d.m.Y");

	//Berechnung Differenz in Tagen
	function return_timestamp($date){
	$pieces = split("\.",$date);
	$stamp = mktime(0, 0, 0, $pieces[1],$pieces[0] , $pieces[2]);
	return($stamp);
	}

	$begin = return_timestamp($heute);
	$end = return_timestamp($ende);

	$s = ($end - $begin)/86400;
	$tage = round($s,0);
	return $tage;
}

Diese Funktion verlangt als Eingabewert das Enddatum in dieser Form (TagTag.MonatMonat.JahrJahrJahrJahr) und gibt die Differenz vom jetzigen Zeitpunkt bis zum angegebenen Datum an.

Beispiel: Wäre heute der 15.03.2011 und ich wollte die Anzahl an Tagen bis übermorgen ermitteln, müsste ich so vorgehen.

$resttage = getDaysTo("17.03.2011");

So, nun haben wird die Anzahl an Tagen in der Variable $resttage gespeichert. Jetzt beginnt die eigentliche Arbeit, nämlich das Herumquälen mit GDLib :-).

Was ist GDLib

Die GD Library ist eine Programmbibliothek mit Schnittstelle zu PHP und anderen Programmiersprachen. Mit GDLib können Grafiken manipuliert/erzeugt/bearbeitet werden. Da ich selbst GDLib nur sehr grundlegend beherrsche, halte ich es nicht für sinnvoll mehr darüber zu schreiben. Im Internet haben Leute Tutorials geschrieben, die mit der Thematik ungleich besser vertraut sind. Für GD Library gibt es im Netz jede Menge interessanter Tutorials. Zum Einsteigen empfehle ich hier mal vorbeizuschauen: http://macx.de/essays/gdlib/.

Und wo bleibt der Counter?

Wie gesagt: Das hier sollte nie ein Copy & Paste-Tutorial werden. Das war ein Denkanstoß, ihr wisst jetzt nämlich wo ihr suchen müsst. Die Code für die Berechnung der Rest-Tage habt ihr jetzt und in GDLib muss man sich einfach ein bisschen einarbeiten, dann ist das alles auch relativ easy. Viel Spaß beim herumbasteln!

Anzeige


Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert