Javascript ist Toll!

LED Laufschrift mit Javascript

Im selfhtml Forum hatte jemand nach einer LED Anzeige mit JS gefragt. Da meine Suche im Netz nur entweder Flash Beispiele oder untaugliche JS Skripte erbrachte, habe ich ein kleines LED Anzeige Skript geschrieben.

Beispiel

Der Quellcode unten zeigt, wie das Objekt aufgerufen wird. Im HTML Code existiert ein DIV mit der id led1 und led2, dort wird das LED Objekt eingefügt, welches zuvor mit led_objekt.create() erzeugt wurde.
Die Links start und stopp, rufen die entsprechenden Memberfunktionen auf und speed setzt die Eigenschaft, die die Laufgeschwindigkeit der Anzeige ändert.

Beispiel 1

erzeugt mit: new LED(12, 60, 2)

Die Eigenschaften objekt.fgClr und objekt.bgClr bestimmen die Farben und beim Aufruf von objekt.create(Höhe, Breite, Pixelgröße) kann die Größe der Anzeige angegeben werden. Dadurch ändert sich aber nicht die Größe der Buchstaben.

Diese können nur geändert werden, wenn ein anderes Objekt LED_Chars erstellt wird und eingebunden wird. Dazu sind aber Kenntnisse nötig, wie eine Zahl binär aufgebaut ist.

Beispiel 2

erzeugt mit: new LED(1, 35, 3) (die Mindesthöhe der Anzeige, ist die Höhe der Buchstaben)

Beispiel Quellcode

Der Code zu den Beispielen sieht folgendermaßen aus:

var led1, led2;

window.onload = function() {

	led1 = new LED(12, 120, 4);

	var el = led1.create()

	var p  = document.getElementById('led1');

	p.appendChild(el);

	led1.setText(" pause@ blink#{1} scroll^{1} flash_{2} 1234567890?!,");

	led2 = new LED(1, 35, 3);

	var el = led2.create()

	var p  = document.getElementById('led2');

	p.appendChild(el);

	led2.setText("scroll^{1} flash_{2} ");

}

Update: Ich hab das Skript mittlerweile (14.2.2009) stark erweitert und arbeite an einen Editor für die Buchstaben. Der erste Entwurf findet sich hier. Dort lassen sich einige Funktionen die ich neu eingebaut habe ausführen.

Download

Das Skript besteht aus insgesamt drei Dateien. Das eigentliche LED Objekt ist eine Ableitung von LED_Panel, die Buchstaben stecken im Objekt LED_Chars, dort sind die Buchstaben als Bitmap kodiert. Um andere Buchstaben darstellen zu können, kann dieses Objekt ausgetauscht oder erweitert werden.

led.js
led-panel.js
led-char.js