Steuerung von JSmol über Schaltflächen und SkriptkommandosDarstellung von Molekülen mit Hilfe von JSmol
Mit Hilfe des JSmol Menüs können viele Einstellungen vorgenommen werden, was jedoch häufig recht umständlich ist, oder die gewünschten Befehle werden gar nicht aufgeführt. Viel eleganter gestaltet sich hierbei die Steuerung des Applets mittels Schaltflächen, Radio Buttons oder Checkboxen, was folgende Anleitung beschreibt. Da der Funktionsumfang von JSmol sehr groß ist, würde eine komplette Beschreibung aller Befehle den Rahmen dieses Tutorials sprengen. Eine komplette Liste der Funktionen zur Erstellung von Schaltflächen und die dazugehörige Syntax der Befehle ist im JSmol Wiki zu finden.
Allgemeines und Syntax der Kommandos
Prinzipiell können alle Skriptkommandos allen Schaltflächen zugeordnet werden. Es ist also egal, ob der Befehl, der ein neues Molekül in das Applet lädt, über einen Button gegeben wird oder über eine Checkbox. Hier bleibt es dem Nutzer selbst überlassen, für welche Variante er sich entscheidet.
Die Befehl für eine Schaltfläche bestehen allgemein aus folgenden Teilen:
Ein Skript beginnt immer mit einem Kommando, auf welches eine Reihe von Parametern folgt, die mit einem ";" abgeschlossen werden. Zum Beispiel wird mit dem Skript "load Dateipfad/Molekül.xyz;" die Datei "Molekül.xyz" vom angegebenen Dateipfad geladen. Ein Skript ist nicht auf nur ein Kommando beschränkt, sondern kann aus beliebig vielen bestehen. Diese werden dann der Reihe nach von JSmol abgearbeitet. Wichtig ist dabei, dass die aufeinander folgenden Befehle stets durch ein ";" voneinander getrennt werden müssen. Beispielsweise lädt das Skript "load Dateipfad/Molekül.xyz; spin y 10;" zunächst die Datei "Molekül.xyz" vom angegebenen Dateipfad und schaltet dann die Moleküldrehung um die Y-Achse mit 10° pro Sekunde an.
ButtonsEin Button ist eine einfache Schaltfläche, die ein Skriptkommando ausführt, wenn sie angeklickt wird. In die unter "2. JSmol in HTML einbinden" bereits erstellte Seite soll nun ein Button eingefügt werden, der eine neue Moleküldatei in das bereits vorhandene Applet einliest. Der Befehl lautet wie folgt:
Mit obigem Befehl wird in die Seite, die bereits ein Applet mit der eindeutigen ID "applet1" enthält, ein Button eingefügt, der bei einem Klick die Moleküldatei "h2o.mol" aus dem Verzeichnis "molecules/" in das Applet mit der ID "applet1" lädt. Der Button ist dabei mit "H20" beschriftet und hat die eindeutige ID "B1". Das Beispiel veranschaulicht die korrekte Syntax der Befehle
CheckboxenDie Befehlssyntax von Checkboxen unterscheidet sich etwas von der vorhergehenden Syntax. Da eine Checkbox sowohl eine Funktion hat, wenn sie ausgewählt ist, als auch wenn sie nicht ausgewählt ist, sind hier zwei Skriptkommandos notwendig. Die allgemeine Syntax für eine Checkbox sieht folgendermaßen aus:
In die Seite, in die gerade ein Button eingefügt wurde, soll nun eine Checkbox eingefügt werden, die das geladene Molekül um die Y-Achse rotieren lässt. Ist die Checkbox ausgewählt, soll das Molekül rotieren, ist sie nicht ausgewählt, soll die Rotation stoppen. Der Befehl dazu lautet wie folgt:
Auf der Beispielseite sollte nun eine Checkbox erscheinen, die die Rotation steuert.
Dropdown Menüs
Möchte man viele Einträge platzsparend unterbringen, so bieten sich Dropdown Menüs an. Es können dabei beliebig viele Einträge in einem Menü enthalten sein, wobei der Anwender den entsprechenden Eintrag dann aus der Liste auswählt. Die allgemeine Syntax des Dropdown Menüs lautet:
Die Menüeinträge werden jedoch nicht in den Befehl, der das Menü generiert hineingeschrieben, sondern ähnlich wie bei der Einbindung des Applets in einem vor diesem Kommando stehenden Befehl gesondert definiert. Mit "size" wird festgelegt, wie viele Menüeinträge zu sehen sind. Die bereits vorhandene HTML-Seite soll nun um ein Menü erweitert werden, dass Einträge enthält, die die Hintergrundfarbe des Applets ändern sollen. Zunächst wird eine Variable definiert, die die ID "menu" erhält und in der die Menüeinträge aufgeführt sind:
Der erste Teil vor dem Komma des jeweiligen Befehls ist das Skript, das ausgeführt wird, wenn der Menüeintrag ausgewählt wird. Der zweite Teil definiert den Text, der im Menü angezeigt wird. Die Farbe kann auch als Hexadezimale angegeben werden: [xABCDEF]. Der Wert muss in eckigen Klammern stehen und anstelle von "#" muss ein "x" geschrieben werden. Als Nächstes wird das Menü generiert, welches sich auf die Variable bezieht; der Befehl hierzu lautet:
Die Beispielseite sollte nun ein zusätzliches Dropdown Menü für die Auswahl der Hintergrundfarbe enthalten. Radio GroupsRadio Groups stellen eine zusammengehörige Gruppe von Radio Buttons auf der Seite dar, die wenn sie angeklickt werden, ein Skript ausführen. Der allgemeine Befehl der eine Radio Group erstellt lautet:
Als Nächstes soll in die Beispielseite eine Radio Group eingefügt werden, über die man zwischen der Darstellung des Moleküls als Kugel-Stab-Modell, als Kalotten-Modell oder der Skelettdarstellung wählen kann. Auch hier werden die Einträge für die einzelnen Radio Buttons nicht in den generierenden Befehl geschrieben, sondern wieder als Variable formuliert:
Anschließend wird die Radio Group generiert, einem Applet zugeordnet und die Variable dieser Gruppe zugeordnet.
Wird der Eintrag "seperatorHTML" freigelassen, so werden die einzelnen Radiobuttons der Gruppe nebeneinander angeordnet. Sollen sie jedoch untereinander angeordnet werden, so muss "<br>" eingefügt werden. Die Beispielseite verdeutlicht dies.
E-Mail: Walter.Wagner ät uni-bayreuth.de, Stand: 24.06.14 |
||||||||||||||||||||||||||
