vorheriges KapitelInhaltsverzeichnisStichwortverzeichnisFeedbacknächstes Kapitel


Woche 2

Tag 14

JavaScript und Java, allgemeine Multimedia- Techniken

Am abschließenden Tag der zweiten Woche wollen wir uns in der Hauptsache mit dem Zusammenspiel von JavaScript und Java beschäftigen. Beide Techniken ergänzen sich im Rahmen des WWW hervorragend. Jede hat ihre spezifischen Aufgaben und teilweise kann man mit beiden Techniken ein Problem angehen. Es gibt überdies zahlreiche Schnittstellen, wo diese beiden zwar vom Namen eng, von der Konzeption und Technik jedoch nur sehr weitläufig verwandten Sprachen zusammenspielen können.

Heute stehen deshalb einmal die so genannten Java-Applets und ihre Referenz in einer Webseite mit allen notwendigen Fassetten auf dem Programm, aber auch, wie man zwischen einem JavaScript bzw. einer HTML-Seite und einem Java-Applet Daten austauschen kann. Dazu müssen wir zuerst einmal wieder auf HTML zurückgreifen und den Weg besprechen, wie Applets überhaupt in eine Webseite eingebunden werden können. Des Weiteren werden auch einige Aspekte von Java selbst näher zu beleuchten sein.

In einem logischen Zusammenhang mit der Einbindung von Java-Applets in Webseiten sind die Verbindungen von HTML-Gerüsten mit beliebigen Multimedia-Erweiterungen (dazu zählen wir auch ActiveX-Controls) zu sehen. Auch diese sollen in diesem Kapitel besprochen werden.

Allgemeines zur Einbindung von Java-Applets und multimedialen Objekten

Über HTML-Referenzen kann in Webseiten eine Vielzahl von Erweiterungelementen eingebunden werden. Das fängt am unteren Ende mit Grafiken an und geht bis hin zu vollständigen Programmen, die in einer Webseite referenziert werden können. In einem logischen Zusammenhang wollen wir dabei die hier folgenden Objekte sehen:

Allgemeines zur Einbindung von Java-Applets

Java-Applets lassen sich auf verschiedene Weise in HTML-Seiten referenzieren. Ganz am Anfang gab es den <APP>-Tag, aber der wird nicht mehr verwendet. Derzeit sind drei Tags üblich:

Wir wollen hier alle drei Varianten behandeln, uns aber im Wesentlichen auf die dritte Version konzentrieren.

PlugIns

In Webseiten lassen sich diverse Techniken einbinden, welche erst einmal durch die Standardaustattung des Browsers nicht unbedingt unterstützt werden. Das bedeutet, wenn eine Datei eines bestimmten Dateiformats im Rahmen einer Webseite geladen und dargestellt oder ausgeführt werden soll, kann ein Browser unter Umständen nicht direkt damit umgehen. Eine Erweiterung des Browsers um einen Interpreter für diese Formate löst das Problem. Netscape entwickelte schon vor geraumer Zeit zum Hinzufügen neuer Funktionen zum Browser die Technik des Installierens von so genannten PlugIns (Erweiterungsmodule für den Navigator). PlugIns werden mittlerweile auch von anderen Browsern unterstützt und lassen sich von zahlreichen Seiten aus dem Internet laden. Etwa von der Netscape-Seite http://home.netscape.com/plugins/, von wo zahlreiche PlugIns für die unterschiedlichsten Dateiformate (nicht nur Netscape-spezifische) geladen und dann im Browser installiert werden können.

Abbildung 14.1:  Diverse PlugIns gibt es bei Netscape

Die PlugIn-Idee kann trotz ihrer unbestrittenen Pluspunkte auch kritisch gesehen werden. Das Konzept beinhaltet auch einige Fassetten, die nicht unbedingt vorteilhaft sind:

1. Die Standardisierung von Vorgängen und Formaten im Internet wird behindert (nicht gefördert, wie man vielleicht zuerst vermuten mag)! Immer mehr Anbieter von (vor allem multimedialen) Informationen stellen sich auf den Standpunkt, dass sie sich nicht an irgendwelche vorhandenen Dateistandards halten brauchen. Es gibt ja PlugIns, und der Anwender wird sich schon so ein neues PlugIn installieren, wenn er die Information nutzen möchte. Also wird flugs ein neues Dateiformat samt PlugIn entwickelt und auf die Internet-Gemeinde losgelassen.

2. Immer mehr PlugIns machen sich über die Zeit auf dem Rechner eines Anwenders breit. Der Rechner wird »zugemüllt«.

3. Der Download eines noch nicht vorhandenen PlugIns kostet zusätzliche Online-Zeit und damit das Geld des Anwenders. Wenn sich Informationsanbieter an Standardformate halten würden, müssten sich Besucher nicht immer neue PlugIns auf ihre Kosten auf den Rechner laden.

Die Installation von PlugIns kann im Übrigen über spezielle Befehle in einer HTML-Seite angestoßen werden.

Der <EMBED>-Tag ist eine Netscape-Erweiterung von HTML 3.2 zur allgemeinen Einbindung von Multimedia-Elementen in eine Webseite. Damit können neben dem Aufruf von PlugIns auch lokale Programme zur Darstellung von Nichtwebformaten (etwa Bilder mit der Erweiterung .bmp) aufgerufen werden.

Die allgemeine Syntax des HTML-Containers für PlugIns sieht so aus:

<EMBED 
  type="[PlugIn]"
  pluginspace="[URL]"
  code="Datei"
  object="[Zusatzangaben]"
  codebase="[Verzeichnis der Datei]"
  width="[Breite]"
  height="[Höhe]">

Den <EMBED>-Tag gibt es auch in einer einfacheren Variante. Damit kann er auch zur Einbindung von Videos und Musik in den üblichen Standardformaten verwendet werden. Syntax:

<EMBED 
  src="[URL]"
  width=[Breite in Pixel]
  height=[Höhe in Pixel]
  controls=console>

In dem optionalen <NOEMBED>-Container kann ein Alternativtext für Browser angegeben werden, die PlugIns nicht unterstützen.

Beispiel 1:

Geben Sie folgenden Quelltext ein:

<HTML>
<BODY>
<EMBED src="video001.avi" width=300 height=300>
<NOEMBED>Hier läuft eigentlich ein Video.</NOEMBED>
</BODY>
</HTML>

Speichern Sie das Script unter Embed.htm und laden Sie es in einen Browser. Es wird beim Laden der Datei der mit dem Browser verbundene Mediaplayer gestartet (wenn so ein Player nicht vorhanden ist, kann es Probleme geben) und das angegebene Video abgespielt. Sie benötigen natürlich ein Video mit dem angegebenen Namen (oder müssen das Beispiel entsprechend anpassen) - auf der Buch-CD finden Sie ein solches. Sie können das Beispiel auch so umbauen, dass ein beliebiges anderes Video abgespielt wird.

Abbildung 14.3:  Abspielen eines Videos

Beispiel 2:

Das zweite Beispiel Embed2.htm spielt ein MP3- bzw. MPG-Musikstück ab (auch dieses finden Sie auf der Buch-CD). Wir nutzen das Beispiel dazu, noch mal die Verwendung von Metainformationen in einem praktischen Beispiel zu zeigen:

<HTML>
<HEAD>
<TITLE>Safety First - Demo<TITLE>
<META name="Author" content="Ralph Steyer">
<META name="description" content="Demo von Safety First">
<META name="keywords" content="History, MP3, Rock, Blues, Boogie">
<META name="copyright" content="2000 Safety First">
<META name ="organization" content ="Safety First - RJST@gmx.de">
</HEAD>
<BODY>
<EMBED src="history.mpg" width=300 height=300>
<NOEMBED>Hier sollte ein Mediaplayer das MP3-Musikstück History abspielen.
</NOEMBED>
</BODY>
</HTML>

Die Verwendung des <EMBED>-Tags sollte mit Vorsicht geschehen, da die Technik im Wesentlichen auf Netscape Browser ab der Version 4.x und neuere Varianten des Explorer beschränkt ist. Aber auch sonst gehört der Tag zu den Elementen, die als deprecated gelten.

Einbinden eines Java-Applets mit dem <EMBED>-Tag

Der allgemeine <EMBED>-Tag zur Einbindung von beliebigen Multimedia- Elementen lässt sich auch bei Applets anwenden. Er wird in diesem Zusammenhang gelegentlich Java PlugIn-Tag genannt, weil er genau genommen ein PlugIn zur Ausführung eines Applets angibt. Die Verwendung sollte mit Vorsicht geschehen, da die Technik wie gerade oben schon erwähnt nur eingeschränkt unterstützt wird und außerdem als deprecated erklärt ist. Grundsätzlich erfolgt die Einbindung von einem Java- Applet mit dem <EMBED>-Tag wie in dem folgenden Beispiel:

<HTML>
<BODY>
<EMBED type="application/x-java-applet"
  code="DasApplet.class"
  width="200" height="300">
</EMBED>
</BODY>
</HTML>

Java-Applets werden mit dieser Technik mittels des angegebenen Java- PlugIns gestartet. Das Problem dieser Form der Einbindung ist, dass das Applet nicht dargestellt werden kann, wenn das angegebene PlugIn nicht zur Verfügung steht und gerade keine Online-Verbindung besteht oder der Browser mit PlugIns dieser Form nicht zurechtkommt.

Der <OBJECT>-Tag

Der <OBJECT>-Tag ist der offizielle Standard-Tag unter HTML 4.0 zum Einbinden von beliebigen Multimedia-Objekten in eine Webseite. Damit soll er nach dem Willen des W3C auch zur Referenzierung von Applets verwendet werden. Seit der Einführung von HTML 4.0 soll er der Tag sein, der sämtliche bisher vorkommenden Tags zur Einbindung von multimedialen Objekten ablöst. Damit würden von der Theorie her sowohl der nachfolgend noch besprochene <APPLET>-Tag als auch der sowieso Browser-spezifische <EMBED>-Tag überflüssig.

Besondere Zielrichtung dieser verallgemeinerten Referenzierung sind die vielen Browser-spezifischen propertierenden Tags, wie der nur vom Internet Explorer verstandene <BGSOUND>-Tag zur Einbindung von Hintergrundmusik. Syntax:

<BGSOUND 
  src="[URL]"
  loop=[Anzahl der Wiederholungen]>

Die neue Philosophie möchte sämtliche Multimedia-Referenzen bündeln und alle auf nur einen Mediatyp beschränkten Tags eliminieren (darunter fällt sogar der <IMG>-Tag zur Anzeige von Bildern). Positiver Effekt - die Einführung eines neuen Mediaformats erzwingt keinen neuen Tag, sondern der <OBJECT>-Tag wird nur erweitert.

Den <OBJECT>-Tag gab es schon vor HTML 4.0. Er hat aber in früheren HTML-Versionen ausschließlich zur Einbindung von ActiveX-Controls gedient.

Die Syntax zum Referenzieren eines beliebigen Multimedia-Objekts sieht schematisch so aus:

<OBJECT 
  classid="[ActiveX-ControlId des PLug-In]"
  codebase="[URL PlugIn]"
  width="[Breite]" height="[Höhe]">
<PARAM name="code" value="[Datei]">
<PARAM name="type" value="[PlugIn]">
<PARAM name="codebase" value="[Verzeichnis Datei]">
... alternativer Text...
</OBJECT>

Bei der recht komplexen und umfangreichen Angabe der ClassId und der weiteren Attribute und Parameter schlägt die Stunde von einigen HTML-Tools, die für die Einbindung von vielen Objekten eine automatische Notation von solchen Containern bereits integriert haben. Mit Menüs und Dialogmasken wird die Referenz meist recht komfortabel generiert.

Beispiel 3:

Das nachfolgende Listing (WinMediaPlayerObject2.htm) ist die Einbindung des Windows-Mediaplayers als ActiveX-Control (und damit nur Internet- Explorer-fähig):

<HTML>
<BODY>
<OBJECT
  classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95"                               id="MediaPlayer1"
  width="286" height="225">
<PARAM name="AudioStream" value="-1">
<PARAM name="AutoSize" value="-1">
<PARAM name="AutoStart" value="-1">
<PARAM name="AnimationAtStart" value="-1">
<PARAM name="AllowScan" value="-1">
<PARAM name="AllowChangeDisplaySize" value="-1">
<PARAM name="AutoRewind" value="0">
<PARAM name="Balance" value="0">
<PARAM name="BaseURL" value>
<PARAM name="BufferingTime" value="5">
<PARAM name="CaptioningID" value>
<PARAM name="ClickToPlay" value="-1">
<PARAM name="CursorType" value="0">
<PARAM name="CurrentPosition" value="-1">
<PARAM name="CurrentMarker" value="0">
<PARAM name="DefaultFrame" value>
<PARAM name="DisplayBackColor" value="0">
<PARAM name="DisplayForeColor" value="16777215">
<PARAM name="DisplayMode" value="0">
<PARAM name="DisplaySize" value="0">
<PARAM name="Enabled" value="-1">
<PARAM name="EnableContextMenu" value="-1">
<PARAM name="EnablePositionControls" value="-1">
<PARAM name="EnableFullScreenControls" value="0">
<PARAM name="EnableTracker" value="-1">
<PARAM name="Filename" value="">
<PARAM name="InvokeURLs" value="-1">
<PARAM name="Language" value="-1">
<PARAM name="Mute" value="0">
<PARAM name="PlayCount" value="1">
<PARAM name="PreviewMode" value="0">
<PARAM name="Rate" value="1">
<PARAM name="SAMILang" value>
<PARAM name="SAMIStyle" value>
<PARAM name="SAMIFileName" value>
<PARAM name="SelectionStart" value="-1">
<PARAM name="SelectionEnd" value="-1">
<PARAM name="SendOpenStateChangeEvents" value="-1">
<PARAM name="SendWarningEvents" value="-1">
<PARAM name="SendErrorEvents" value="-1">
<PARAM name="SendKeyboardEvents" value="0">
<PARAM name="SendMouseClickEvents" value="0">
<PARAM name="SendMouseMoveEvents" value="0">
<PARAM name="SendPlayStateChangeEvents" value="-1">
<PARAM name="ShowCaptioning" value="0">
<PARAM name="ShowControls" value="-1">
<PARAM name="ShowAudioControls" value="-1">
<PARAM name="ShowDisplay" value="0">
<PARAM name="ShowGotoBar" value="0">
<PARAM name="ShowPositionControls" value="-1">
<PARAM name="ShowStatusBar" value="0">
<PARAM name="ShowTracker" value="-1">
<PARAM name="TransparentAtStart" value="0">
<PARAM name="VideoBorderWidth" value="0">
<PARAM name="VideoBorderColor" value="0">
<PARAM name="VideoBorder3D" value="0">
<PARAM name="Volume" value="-600">
<PARAM name="WindowlessVideo" value="0">
</OBJECT>
</BODY>
</HTML>

Wenn Sie ein Video bereits als Parameter angeben wollen, müssen Sie die folgende Zeile ändern:

<PARAM name="Filename" value="">

Dort könnte etwa

<PARAM name="Filename" value="file:///C:/TEMP/VIDEO001.avi" valuetype="ref">

stehen, wenn Sie ein lokales Video aus dem Verzeichnis Temp auf dem Laufwerk C: referenzieren.

Abbildung 14.4:  Der Windows Mediaplayer als ActiveX-Control

Einbinden eines Java-Applets mit dem <OBJECT>-Tag

Die Referenz eines Java-Applets mit dem <OBJECT>-Tag sieht von der Syntax her schematisch so aus:

<OBJECT 
  classid="[ActiveX-ControlId des Java-PlugIn]"
  codebase="[URL PlugIn]"
  width="[Breite]" height="[Höhe]">
<PARAM name="code" value="[Applet].class">
<PARAM name="type" value="[PlugIn]">
<PARAM name="codebase" value="[VerzeichnisclassFile]">
... alternativer Text...
</OBJECT>

Beispiel 4:

Das nachfolgende Listing ist die Einbindung eines Java-Applets mit dem <OBJECT>-Tag (identisch zu dem <EMBED>-Beispiel):

<HTML>
<BODY>
<OBJECT
  classid=
  "clsid:8AD9C840-044E-11D1-B3E9-00805F499D93"
  codebase=
  "http://java.sun.com/products/plugin/1.1/
  jinstall-11-win32.cab#Version=1,1,0,0"
  width="200" height="300">
<PARAM name="type" value="application/x-java-applet">
<PARAM name="JAVA_CODE" value="DasApplet.class">
</OBJECT>
</BODY>
</HTML>

Der <OBJECT>-Tag ist wie gesagt der offiziell vom W3C angegebene Tag für die Referenz auf Java-Applets. Sie werden ihn dennoch in kaum einer Webseite mit Java-Applets finden. Gegen die Verwendung des <OBJECT>-Tags spricht neben der recht aufwendigen Syntax vor allem, dass viele Anwender ActiveX-bezogene Technik aus Sicherheitsgründen nicht akzeptieren. Der speziell für Applets vorhandene Tag <APPLET> ist einfacher zu handeln und unproblematischer.

Die Applet-Referenz mit <APPLET>

Die konkrete Referenzierung eines Java-Applets mittels des <APPLET>- Containers ist die mit Abstand populärste Variante (deprecated hin oder her). Der <APPLET>-Container beinhaltet in seinem Inneren gegebenenfalls benötigte Parameter für das Applet, er kann aber auch leer sein, wenn das Applet keine Parameter benötigt. Die Syntax sieht so aus:

<APPLET 
  code="[Klasse]"
  src=[URL]
  codebase=[URL]
  width=[Wert]
  height=[Wert]>
</APPLET>

In einer Applet-Referenz lassen sich noch Angaben über den Textfluss um das Applet herum machen. Der <APPLET>-Tag kann entsprechend um die folgenden optionalen Angaben erweitert werden:

Innerhalb des <APPLET>-Containers selbst (nicht als Attribute des Tags selbst) können zwei Angaben stehen:

Der freie Text im <APPLET>-Container wird dazu verwendet, einem Anwender mit einem nicht Java-fähigen Browser (oder mit deaktiviertem Java) deutlich zu machen, dass an dieser Stelle ein Java-Applet steht. Java- unfähige Browser werden nach dem Prinzip der Fehlertoleranz den <APPLET>-Tag (ebenso natürlich den Abschluss-Tag) ignorieren und den im Container notierten Text als reinen ASCII-Text auf dem Bildschirm anzeigen. Java-fähige Browser (mit aktivierter Java-Option) sind so konzipiert, dass sie den Text innerhalb des Containers nicht anzeigen, sondern nur das Applet selbst.

Die zweite optionale Angabe im <APPLET>-Container sind Parameter, die über HTML-Tags an das Applet übergeben werden. Dabei hängt es natürlich von der Programmierung des Applets ab, ob solche Parameter benötigt werden oder nicht.

Ein oft gemachter Denkfehler bei der Referenzierung von Applets ist es, zu vermuten, dass es doch irgendeine Logik aus Sichtweise der Webseite geben muss, welche Applets Parameter benötigen und welche nicht. Als Webseiten-Ersteller oder JavaScript-Programmierer haben Sie darauf keinerlei Einfluss. Es gilt das Prinzip »Vogel friss oder stirb«. Wenn ein Applet Parameter benötigt, müssen Sie diese korrekt angeben. Kommt es ohne aus, müssen halt keine Parameter im <APPLET>-Container notiert werden (falls doch welche da stehen, werden sie wie üblich ignoriert). So wenig, wie ein Museum, das ein Bild ausstellt, dem Maler sagen kann, wie er das Bild vor Jahren malen muss1 (die Sache ist gelaufen - das Bild ist fertig), so wenig kann derjenige, der ein Applet verwendet, festlegen, ob Parameter anzugeben sind oder nicht.

Die Angabe von Parametern erfolgt innerhalb des <APPLET>-Containers über <PARAM>-Tags - gegebenenfalls mehrere hintereinander (soviel ein Applet halt benötigt - das muss der Beschreibung des Applets entnommen werden). Im Fall von mehreren Parametern spezifiziert jeder einzelne Parameter-Tag einen anderen Applet-Parameter. Die Syntax lautet wie folgt:

<PARAM name=[name] value=[wert]>

Dabei bezeichnet name den Namen des Parameters, wie er auch intern im Java-Quellcode verwendet wird, und value den Wert des angegebenen Parameters.

Wichtig ist zu beachten, dass Java zwischen Groß- und Kleinschreibung unterscheidet. Im Gegensatz zu den meisten anderen Situationen unter HTML muss deshalb der Wert von name unbedingt so geschrieben werden, wie die Dokumentation des Applets es angibt. Das Java-Applet nimmt die Parameternamen und deren Werte in speziellen Methoden entgegen und die unterscheiden Groß- und Kleinschreibung (unter Umständen spielt das ebenfalls beim Wert selbst eine Rolle).

Erstellen wir nun verschiedene Webseiten, die Java-Applets referenzieren, als Beispiele.

Beispiel 5:

Geben Sie folgenden Quelltext ein:

<HTML>
<BODY>
<APPLET
  code=ArcTest.class
  width=400
  height=400>
  Hier sollte ein Applet stehen
</APPLET>
</BODY>
</HTML>

Speichern Sie die Datei unter applet1.htm und laden Sie es in einen Browser. Dabei müssen Sie natürlich sicherstellen, dass Ihnen ein Java- Applet dieses angegebenen Namens zur Verfügung steht. Auf der Buch-CD finden Sie das hier verwendete Applet.

Für die Beispiele verwenden wir teilweise freie Applets, das als Demos mit der Java-Entwicklungsumgebung von Sun, dem JDK 1.2, ausgeliefert werden.

Abbildung 14.5:  Das Applet nach dem Laden

Versuchen Sie nicht, ein Applet umzubenennen. Der Name ist nicht wie bei Dateien anderen Typs willkürlich, sondern in vielen Fällen integraler Bestandteil des Applets.

Das nächste Beispiel arbeitet nun mit Parametern, die an das Applet übergeben werden

Beispiel 6:

Geben Sie folgenden Quelltext ein:

<HTML>
<BODY>
<APPLET
  codebase="."
  code="Chart.class"
  width=251
  height=125>
  <PARAM name=c2_color value="green">
  <PARAM name=c2_label value="Q2">
  <PARAM name=c1_style value="striped">
  <PARAM name=c4 value="30">
  <PARAM name=c3 value="5">
  <PARAM name=c2 value="20">
  <PARAM name=c4_color value="yellow">
  <PARAM name=c1 value="10">
  <PARAM name=c4_label value="Q4">
  <PARAM name=title value="Performance">
  <PARAM name=c3_style value="striped">
  <PARAM name=columns value="4">
  <PARAM name=c1_color value="blue">
  <PARAM name=c1_label value="Q1">
  <PARAM name=c3_color value="magenta">
  <PARAM name=c3_label value="Q3">
  <PARAM name=c2_style value="solid">
  <PARAM name=orientation value="horizontal">
  <PARAM name=c4_style value="solid">
  <PARAM name=scale value="5">
Hier sollte ein Applet stehen
</APPLET>
</BODY>
</HTML>

Abbildung 14.6:  Das Applet, nachdem eine Zeichenaktion ausgelöst wurde

Speichern Sie die Datei unter applet2.htm und laden Sie es in einen Browser. Auch hier müssen Sie wieder sicherstellen, dass Ihnen ein Java- Applet dieses angegebenen Namens zur Verfügung steht. Auf der Buch-CD finden Sie das hier verwendete Applet (siehe Abbildung 14.7).

Abbildung 14.7:  Das Applet mit den Parametern des Beispiels

Verändern Sie die Werte der Parameter und schauen Sie, was passiert (siehe Abbildung 14.8).

Abbildung 14.8:  Das Applet mit anderen Parametern

Zugriff auf Java-Funktionalitäten aus Scripten

Die Verbindung von JavaScript mit Java bzw. Java-Applets ist nicht auf den gemeinsamen, aber sonst unabhängigen Einsatz innerhalb einer Webseite beschränkt. Es gibt mehrere Möglichkeiten, wie JavaScript auf ein Java- Applet Einfluss nehmen kann, aber auch umgekehrt Java-Applets auf Scripte zugreifen können.

Dynamische Generierung der Applet-Referenz

Die einfachste Möglichkeit, um aus JavaScript heraus auf Java-Applets zugreifen zu können, ist die dynamische Generierung einer Webseite mittels document.write(). Damit wird einfach die gesamte Applet-Referenz samt eventuell notwendiger Parameter dynamisch geschrieben. Beim Laden der Webseite wird die Referenz dann verwendet und eventuelle Parameter werden vom Applet aufgenommen.

Beispiel 7:

Wir nehmen hier ein Applet, das in einem Parameter übergebenen Text zerschneidet und in zufälligen Farben die Teilstücke anzeigt. Es entsteht ein blinkender Text, wobei dessen Blinkgeschwindigkeit über einen weiteren Parameter manipuliert werden kann. Wenn die Referenzierung in HTML hardcodiert erfolgt, sieht die HTML-Datei samt Applet-Referenz mit Beispielwerten so aus (App.htm):

<HTML>
<BODY>
<APPLET
  code="Blink.class" width=300 height=100>
  <PARAM
    name=lbl value="Die Antwort ist 42!">
  <PARAM
    name=speed value="4">
  Hier sollte ein Applet ablaufen
</APPLET>
</BODY>
</HTML>

Wenn Sie die Datei in einen Java-fähigen Browser laden, wird der in der Zeile

<PARAM name=lbl value="Die Antwort ist 42!">

angegebene Text mit der in Zeile

<PARAM name=speed value="4">

angegebenen Geschwindigkeit blinkend angezeigt.

Abbildung 14.9:  Das Applet mit den fest in HTML vorgegebenen Parametern

Sie können jetzt in HTML selbst die Werte der Parameter verändern (und auch die Größe des Applets), aber das wollen wir einem Anwender überlassen, der ein Webformular ausfüllen und dort die Eckdaten des Applets eingeben kann.

Beispiel 8:

Geben Sie folgenden Quelltext ein:

<HTML>
<HEAD>
<SCRIPT language="JavaScript">
function belegeVor()
{
document.forms[0].elements[0].value=300;
document.forms[0].elements[1].value=200;
document.forms[0].elements[2].value="Ist das gut?";
document.forms[0].elements[3].value="4";
}
function schreibeSeite(breite, hoehe, text, speed)
{
var appBeginn = '<APPLET code="Blink.class" width=' +
  breite +
  " height=" +
  hoehe +
  ">";
var appPara1 = '<PARAM name=lbl value="' +
  text +
  '">';
var appPara2 = '<PARAM name=speed value="' +
  speed +
  '">';
document.write("<HTML>");
document.write("<BODY>");
document.write("<CENTER>");
document.write(appBeginn);
document.write(appPara1);
document.write(appPara1);
document.write("Hier sollte ein Applet ablaufen");
document.write("</APPLET>");
document.write("</CENTER>");
document.write("</P>");
document.write("</BODY>");
document.write("</HTML>");
}
</SCRIPT>
</HEAD>
<BODY onLoad="belegeVor()">
<CENTER>
<H1>Geben Sie die Eckdaten des Applets ein</H1>
</CENTER>
<FORM>
Breite <INPUT size=4 maxlength=4>
Höhe <INPUT size=4 maxlength=4>
<BR>
Text <INPUT size=60 maxlength=60>
<BR>
Geschwindigkeit <INPUT size=5 maxlength=3>
<P>
<CENTER>
<INPUT type="Button" value="Starte Applet"
onClick="schreibeSeite(
  document.forms[0].elements[0].value,
  document.forms[0].elements[1].value,
  document.forms[0].elements[2].value,
  document.forms[0].elements[3].value)">
</CENTER>
</FORM>
</BODY>
</HTML>

Speichern Sie die Datei unter appletDynamisch.htm und laden Sie diese dann in einen Java-fähigen Browser. Zuerst haben Sie in einem Formular die Möglichkeit, die Breite und Höhe des Applets sowie den für die Anzeige zu verwendenden Text und die Blinkgeschwindigkeit einzugeben. Experimentieren Sie mit verschiedenen Eingaben.

Beachten Sie, dass die Felder vorbelegt sind. Das erledigt die beim Laden der Webseite aufgerufene Funktion belegeVor(). Dabei verwenden wir - wie schon öfter - eine Objektnotation für die Felder des Formulars (das bekommen wir samt einiger anderer Formularfeinheiten in den nächsten Tagen genauer).

Abbildung 14.10:  Das Applet mit den unveränderten Vorgabewerten

Abbildung 14.11:  Das Formular wird vorbelegt

Die Werte, welche der Anwender in das Formular einträgt (beachten Sie, dass die Eingabefelder bezüglich der Größe und der maximal einzugebenden Zeichen begrenzt sind), werden als Übergabewerte an die Funktion schreibeSeite() übergeben.

Abbildung 14.12:  Das resultierende Applet

Abbildung 14.13:  Im Formular werden die Parameter geändert

Dort werden die Übergabewerte mit String-Bausteinen verkettet und diese dann mit den übrigen HTML-Anweisungen über document.write() geschrieben.

Beachten Sie, dass die direkte Notation der Übergabewerte in der Anweisung document.write() nicht sinnvoll ist. Das vorherige Zusammensetzen eines Strings außerhalb der Anweisung ist auf jeden Fall besser.

LiveConnect

Über das dynamische Erstellen der Applet-Referenz aus JavaScript heraus gibt es auch die Möglichkeit, direkt zwischen Quellcodes von einem Java- Applet und einem JavaScript Verbindungen zur Laufzeit zu schaffen. Beide Sprachen sind dynamisch, d.h. noch zu Laufzeit können Dinge hinzugeladen werden, die ein bereits fertiges Script oder Applet beeinflussen können. Um dies zu realisieren, gibt es verschiedene Ansätze, von denen wir exemplarisch einen behandeln.

Der Datenaustausch von JavaScript nach Java und umgekehrt ist nicht ganz trivial. Im Wesentlichen deshalb, weil die Datentypen und Objekte beider Sprachen nicht vollkommen gleich sind. Zwar liegen die allgemeinen Regeln für die Umwandlung von Datentypen und Objekten fest, aber durch die unterschiedlichen Längen der Datentypen und deren Struktur ist eine Konvertierung nicht immer ohne Datenverlust möglich.

Es gibt von Netscape für den externen Zugriff auf Java-Funktionalitäten unter JavaScript innerhalb eines so genannten Objektmodells (das bekommen wir nächste Woche genauer) die Objekte (unbedingt Groß- und Kleinschreibung exakt beachten)

Damit haben Sie Zugriff auf das so genannte Core-Java. Das sind die zum puren Java gehörenden Funktionalitäten. Dazu gibt es zusätzlich die unter JavaScript ansprechbaren Objekte

die den Zugriff auf die herstellerspezifischen Java-Pakete netscape.* bzw sun.* ermöglichen. Das gesamte Konzept wird von Netscape unter dem Namen LiveConnect zusammengefasst und beinhaltet auch den umgekehrten Zugriff aus Java heraus auf JavaScript.

LiveConnect funktioniert ausschließlich mit dem Netscape Navigator oder kompatiblen Browsern. Das gesamte Verfahren setzt zudem für eine tiefer gehende Anwendung einige Grundkenntnisse in Java voraus, auf die wir hier nicht eingehen können und weshalb wir ziemlich an der Oberfläche bleiben müssen. Zudem müssen einige Java-Details einfach so hingenommen werden.

Über das Packages-Objekt bzw. die anderen genannten Objekte hat man aus JavaScript heraus Zugriff auf alle unter Java als public deklarierten Methoden und Felder. Dies sind solche Methoden und Eigenschaften, die über dieses Java-Schlüsselwort für den Zugriff von außen freigegeben sind. Auf Elemente, welche nicht so deklariert sind, hat man keinerlei Zugriff. Das ist aber nicht als ein Nachteil zu verstehen - wenn Sie ein Auto fahren wollen, brauchen Sie ja auch keinen direkten Zugriff auf die Motorelektronik. Im Gegenteil - das wäre gefährlich und könnte die gesamte Funktionalität in Frage stellen, wenn man da was veränderte. Ein Objekt sollte nur das nach außen geben, was notwendig ist, und den Rest im Hintergrund und vor dem Anwender verborgen erledigen.

Aus JavaScript heraus können Sie nun mittels der Standard-Punktnotation auf die Methoden und Eigenschaften von Java zugreifen, die in den angegebenen Paketen bereitgestellt werden (sofern die JVM zur Verfügung steht, was in neueren Browsern aber so gut wie immer der Fall ist - sonst würden auch Java-Applets nicht laufen). Die Objekte java, netscape und sun sind einerseits Eigenschaften von Packages, andererseits wieder selbst Objekte, welche die Pakete java.*, netscape.* und sun.* repräsentieren.

Selbstverständlich kann man mit dem Aufruf von Java-Funktionalitäten aus JavaScript heraus auch auf Applets zugreifen (über die nächste Woche noch intensiver auszudiskutierende Syntax

document.[Applet].[Appletmethode/Appleteigenschaft]),

aber man kann noch viel mehr machen. Aus JavaScript heraus kann man auf den Konstruktor (das ist eine besondere Methode, mit der ein Objekt erzeugt werden kann - das werden wir auch bei JavaScript in der nächsten Woche sehen) einer beliebigen Java-Klasse mit folgender Syntax zugreifen:

var [JavaScriptObjektvariable] = new Packages.[Klasse];

Das sieht etwa für die Java-Klasse Frame zum Erstellen eines Fensters aus JavaScript wie folgt aus:

var meinFrame = new Packages.java.awt.Frame();

Es geht sogar noch einfacher, denn die jeweiligen JavaScript-Objekte netscape, sun und java stehen als Synonyme für die Pakete gleichen Namens. Daher ist ein Zugriff auch ohne das Packages-Schlüsselwort möglich. Das Beispiel von oben sieht dann so aus:

var meinFrame = new java.awt.Frame();

Das Package-Objekt stellt überdies mit der Eigenschaft className den Pfadnamen zu jeder aus JavaScript erreichbaren Java-Klasse zur Verfügung. Darüber kann dann sogar auf Java-Klassen außerhalb der direkt auf Toplevel-Ebene zur Verfügung stehenden Pakete zugegriffen werden.

Nochmals der Hinweis, dass die LiveConnect-Technik explizit auf das Netscape-Objektmodell abgestimmt ist.

Beispiel 9:

Geben Sie folgenden Quelltext ein:

<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function ausgabe()
{
java.lang.System.out.println(
"Erbarme - zu spät. Die Hesse komme.");
}
</SCRIPT>
</HEAD>
<BODY onLoad=ausgabe()>
</BODY>
</HTML>

Abbildung 14.14:  Nicht eindrucksvoll, aber die Ausgabe erfolgt über Java

Speichern Sie das Script unter Java1.htm und laden Sie es in den Netscape Navigator. Das erste einfache Beispiel demonstriert die Ausgabe auf Systemebene über die Java-Standardausgabemethode println(), welche innerhalb eines JavaScripts aufgerufen wird. Die Ausgabe erfolgt in der Java-Console, welche im Communicator (unter dem Menüpunkt Communicator und Extras) erst geöffnet werden muss, bevor man etwas sehen kann.

Das nächste, etwas komplexere Beispiel greift über Java auf die Systemeinstellungen zu und gibt diese Informationen in der Java-Console aus:

Beispiel 10:

Geben Sie folgenden Quelltext ein:

<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function ausgabe()
{
var Syst = java.lang.System;
var OS = Syst.getProperty("os.name");
var OSver = Syst.getProperty("os.version");
var JavaVer = Syst.getProperty("java.version");
java.lang.System.out.print("Die Java-Version: ");
java.lang.System.out.println(JavaVer);
java.lang.System.out.print("Das Betriebssystem: ");
java.lang.System.out.println(OS);
java.lang.System.out.print(
"Die Betriebssystemversion: ");
java.lang.System.out.println(OSver);
}
</SCRIPT>
</HEAD>
<BODY onLoad=ausgabe()>
</BODY>
</HTML>

Speichern Sie das Script unter Java2.htm und laden Sie es in den Netscape Navigator. Über die Methode getProperty() werden verschiedene Eckdaten der Plattform abgefragt, die dann wieder in der Java-Console ausgegeben werden. Beachten Sie bitte, dass wir hier zwei verschiedene Methoden zur Ausgabe verwenden. Einmal println(), aber auch print(). Während println() einen Zeilenvorschub bewirkt (dieser wirkt sich hier aus - die Ausgabe erfolgt nicht im Rahmen der Webseite, wo ein expliziter HTML-Tag benötigt würde), wird print() eine Ausgabe des spezifizierten Inhalts ohne Zeilenvorschub auslösen.

Abbildung 14.15:  Systemdaten unter Java  ermittelt

Das dritte Beispiel zur Anwendung von LiveConnect verwendet eine JavaScript-Funktion, um darin ein Java-Fenster zu erstellen und anzuzeigen. Dabei wird mittels Java die Titelzeile des Fensters beschriftet, die Hintergrundfarbe gesetzt, ein Layout festgelegt und zwei Buttons im Fenster plaziert. Bitte beachten Sie, dass der Java-Code keinen Schließbefehl für das erzeugt Fenster enthält (Schließen des Browsers beendet auch das Fenster) und auch die Buttons noch keine weitergehende Funktionalität haben (das würde zu weit in Java hineinführen).

Beispiel 11:

Geben Sie folgenden Quelltext ein:

<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function fenster()
{
var meinFenster = new java.awt.Frame();
var meinButton1 = new java.awt.Button("Okay");
var meinButton2 = new java.awt.Button("Nicht okay");
var evt = new java.awt.Event();
meinFenster.setSize(350,200);
meinFenster.setTitle("Mein Java-Fenster");
meinFenster.setLayout(new java.awt.FlowLayout());
meinFenster.setBackground(java.awt.Color.red);
meinFenster.add(meinButton1);
meinFenster.add(meinButton2);
meinFenster.setVisible(true);
}
</SCRIPT>
</HEAD>
<BODY onLoad=fenster()>
</BODY>
</HTML>

Abbildung 14.16:  Ein per JavaScript-Funktion aufgerufenes Java-Fenster

Zusammenfassung

HTML kann mittels Referenzen und zahlreicher Techniken ergänzt werden. Dabei gibt es von der Theorie her seit HTML 4.0 einen zentralen HTML- Tag, der alle diese Aufgaben erledigt: <OBJECT>. In der Praxis zeigt sich jedoch, dass dieser Tag die vielen, für jede Technik individuellen, Tags noch lange nicht verdrängt hat. Insbesondere für die Referenz von Java-Applets ist der <APPLET>-Tag das Maß aller Dinge.

Um aus HTML auf Java-Applets zugreifen und sie beeinflussen zu können, enthält die Applet-Referenzierung bei Bedarf spezielle Parameter-Tags. Diese Beeinflussung über Parameter aus HTML heraus ist jedoch nur statisch, d.h. einmal fest in die Webseite geschrieben. Wenn man das Java- Applet weitergehend manipulieren möchte, bietet JavaScript (aber auch andere Scriptsprachen wie VBScript) einen idealen Ansatz. Da man mit JavaScript dynamisch Webseiten schreiben kann, ist es auch leicht möglich, die komplette Applet-Referenz neu zu schreiben.

Fragen und Antworten

Frage:
Kann man nur den <APPLET>-Tag mit JavaScript neu schreiben?

Antwort:
Nein. Selbstverständlich kann eine Applet-Referenz auch mit den anderen Tags dynamisch generiert werden. Und nicht nur Applet- Referenzen.

Frage:
Kann man auch andere multimediale Elemente aus JavaScript heraus beeinflussen?

Antwort:
Ja. Alle Elemente, die per HTML Parameter übergeben bekommen, können damit auch über JavaScript dynamisch manipuliert werden. Etwa ActiveX-Controls. Aber auch Bilder, Tabellen usw. Gerade Letzteres werden wir aber noch genauer sehen. Der Zugriff direkt auf Techniken jenseits von Java auf Source-Ebene wie unter LiveConnect ist jedoch unter JavaScript nicht-trivial. (Wobei auch die Java-JavaScript-Verbindung nicht als trivial angesehen sollte - sie ist nur bei LiveConnect durch die Oberhoheit von Netscape stark standardisiert.)

Frage:
Brauche ich für die Anwendung von LiveConnect irgendwelche Java- Entwicklungstools oder sonstige Programme oder Dateien?

Antwort:
Nein. Jeder neuere Netscape Browser beinhaltet bei richtiger Installation bereits alles, damit Java so unterstützt und so angewandt werden kann. Das bedeutet aber nicht, dass Sie bereits Java-Applets oder vollständige Java-Programme erstellen können. Dafür benötigen Sie dann Java-Entwicklungstools wie das JDK.

Frage:
Kann ich mit reinen JavaScript-Kenntnissen LiveConnect sinnvoll nutzen?

Antwort:
Nein. Vermutlich nicht. Java unterscheidet sich doch erheblich von JavaScript. Ohne ausreichende Java-Kenntnisse wird der Einsatz kaum effektiv. Aber man sollte beachten, dass das Lernniveau von Java erheblich über dem von JavaScript liegt. Insbesondere ist die Anfangsschwelle von Java sehr hoch. Es wird insbesondere viel Hintergrundwissen aufgebaut werden müssen, bevor man die ersten Erfolge sieht und vor allem deren Vorgänge versteht.

Workshop

Nehmen Sie sich die Video-Referenz in Beispiel 1 mit den statischen Parametern vor und schaffen Sie analog dem Beispiel 7 ein Formular, in dem ein Anwender Parameterwerte (sprich den Namen eines Videos) auswählen kann. Daraus schreiben Sie dann die konkrete Video-Referenz. Sie sollten natürlich ein paar Videos parat haben.

Verändern Sie in Beispiel 8 die Ausgabe. Fügen Sie weitere Ausgabezeilen hinzu.

Verändern Sie Beispiel 9 so, dass die Ausgabe als neu generierte Webseite erfolgt (mit document.write()).

Kontrollfragen

Im Anhang »Antworten zu den Kontrollfragen« finden Sie die Antworten zu den jeweils am Ende einer Lektion notierten Fragen.

  1. Was stimmt hier nicht?
    <EMBED 
    src="video001.avi"
    width=300
    height=300
    <NOEMBED>>
    Hier läuft eigentlich ein Video.
    </NOEMBED>
  2. Ist das korrekt?
    <EMBED 
    type="application/x-java-applet"
    code="MeinApplet.class"
    width="300"
    height="200">
  3. Was tut folgender HTML-Tag?
    <BGSOUND 
    src="test.wav"
    loop=2>

  4. Was muss bei der Angabe von Parametern für ein Java-Applet unbedingt beachtet werden?
  5. Versteht der Internet Explorer LiveConnect?
  6. Ist das korrekt?
    <APPLET 
    code=ArcTest.class
    height=400>
    Hier sollte ein Applet stehen
    </APPLET>
  7. Was ist der Unterschied zwischen den Java-Methoden println() und print()?
  8. Was bewirkt folgende Syntax?
    var meinFrame = new Packages.java.awt.Frame();



vorheriges KapitelInhaltsverzeichnisStichwortverzeichnisFeedbackKapitelanfangnächstes Kapitel


1

© Markt+Technik Verlag, ein Imprint der Pearson Education Deutschland GmbH