Am Donnerstag widmete ich mich noch den Tooltips, die ich ja auch in die Datenbank eingliedern sollte. Das war um einiges leichter als den Slider zu erstellen, weil ich mich, bevor ich den Slider erstellen konnte, erst einlesen musste, da ich zuvor noch nie mit Javaserverpages gearbeitet hatte. Bei den Tooltips hingegen musste ich nur die entsprechende Javascript library in den der Datei einfügen und im CSS File die Darstellung festlegen. Aber es war trotzdem eine Menge Arbeit, da ich jede jsp-Datei durchsuchen musste, ob Tooltips enthalten waren und wenn ich welche gefunden habe, durfte ich nicht vergessen aufzuschreiben, in welchen Dateien ich etwas verändert habe. Aber schlussendlich funktionierten alle Tooltips, der Slider, und das Autocomplete Feld.
Der Freitag war leider auch schon mein letzter Praktikumstag. Ich habe ihn noch dazu genützt, kleine Fehler in meinen ersten Übungen auszubessern, wie zum Beispiel absolute Pfadangaben durch relative zu ersetzen, da es ja sonst auf keinem Rechner außer meinem funktionieren würde. Dann habe ich alles, was ich in diesen vier Wochen gemacht habe, geordnet, zusammengefasstund kommentiert, damit Edith auch später noch etwas damit anfangen kann und es nicht zu unübersichtlich ist. Dann musste ich mich auch schon verabschieden, da mein vierwöchiges Praktikum jetzt zu Ende ist. Ich habe in dieser Zeit viel gelernt und bin froh, dass ich die Möglichkeit zu diesem Praktikum bekommen habe.

Am Dienstag habe ich erfahren, dass ich in dieser Woche keine neue Aufgabe mehr bekommen werde, sondern meine bisher erstellten Elemente in die GiSAO Datenbank eingliedern soll. Das hört sich leichter an, als es ist, und Edith hat sich auch fast den ganzen Tag darum bemüht, dass ich auf die Datenbank zugreifen kann, und Änderungen vornehmen kann.
Aber dann konnte ich damit anfangen, in den bereits vorhandenen Autocompleter der Datenbank eine Scrollbar einzufügen und eine maximale Höhe für das DropDown Feld festzulegen. Da ich dabei ja nur das CSS File verändern musste, war das keine allzu schwere Aufgabe.
Meine Beschäftigung am Mittwoch war schon eine Spur schwieriger. Ich sollte einen Slider in die Datenbank einbauen, der sich erstens an das Design der Datenbank anpasst, zweitens mit Script.aculo.us erstellt wurde, und drittens seinen Wert auf zwei Kommastellen genau in einem Textfeld anzeigt. Dabei ergab sich das Problem, dass man bei Script.aculo.us zwar bestimmte Werte einstellen kann, die der Slider annehmen soll, aber man kann nicht wie bei jQuery einen Schritt festlegen, den er immer vornehmen soll. Daher stellte die Vorgabe mit den zwei Kommastellen zuerst ein Problem für mich dar, da ich ja wohl kaum alle Werte zwischen 0 und 16 auf zwei Kommastellen genau in den Code schreiben konnte. Schlussendlich habe ich den ganzen Slider in eine Funktion verpackt, und mit toFixed(2) die Kommastellen festgelegt. Das war für die Datenbank eine ideale Lösung, da diese Methode von allen wichtigen Browsern unterstützt wird.

Der Freitag war für mich ein angenehm kurzer Arbeitstag. Ich durfte zwar viel früher nach Hause gehen, aber dafür habe ich mich am Vormittag noch auf meine Preloader konzentriert. Ich habe zum Beispiel noch einen Preloader hinzugefügt, den ich mit der Javscript-library Mootools erstellt habe. Der hat allerdings den Nachteil, dass er mit einer ordentlichen Verspätung erscheint, darum sind meine Favoriten die Preloader mit jQuery bzw. ohne Javascript-library.
Montagvormittag habe ich die Preloader abgeschlossen und Edith gezeigt. Ich sollte erneut eine Liste aufstellen, die die Vor- bzw. Nachteile, verwendete Scripts, Beispieldateien und eine Beschreibung enthält. Nachdem ich mit dieser Tabelle fertig war, habe ich begonnen, meine Dokumentation zu schreiben, die ich ja schon bald einreichen soll. Ich bin relativ gut damit zurecht gekommen, und ich bin froh, dass ich damit später weniger Arbeit zuhause haben werde.
Ansonsten kann ich nur sagen, dass im Moment eine Urlaubswelle das Büro leert ;-) Wir sind schon nur mehr zu dritt...

Am Mittwoch habe ich eine neue Aufgabe bekommen. Ich sollte einen Slider programmieren, der sich in seiner Gestaltung von den normalen abhebt. Als Zusatzkriterium sollte die Ausgabe der Werte des Sliders auf zwei Kommastellen genau erfolgen. Natürlich hat wieder einmal jQuery die beste Lösung geboten, aber auch mit Script.aculo.us ist es möglich, einen Slider zu gestalten. Script.aculo.us bietet den Vorteil, das man ein Bild als handle für den Slider verwenden kann. Das geht zwar mit jQuery auch, aber bei Script.aculo.us wird dabei auch die Form des Bildes übernommen. Ansonsten bietet jQuery viel mehr Möglichkeiten einen Slider zu gestalten und ist auch sehr einfach anzuwenden.
Meine nächste Aufgabe wird mich für den Rest der Woche beschäftigen. Ich soll mehrere Preloader programmieren, die dem Besucher einer Website sagen, dass die gewünschte Seite geladen wird, damit dieser sie nicht frustriert wegklickt.
Damit habe ich auch den Donnerstag begonnen, und ich bin auch schon recht weit mit meinem Preloader. Ich habe zum Beispiel eine Prozentleiste in meine Website eingebaut, die dem User sagt, zu wieviel Prozent die (großen) Bilder bereits geladen sind. Außerdem habe ich mehrere Seiten mit animierten Bildern als Preloader erstellt und zum Schluss eine Seite, die jedesmal, wenn sie geladen wird, einen anderen, zufällig ausgewählten, Preloader zeigt.
Am Vormittag durfte ich wieder im Labor zusehen und auch ein paar Sachen selbst probieren. Diesmal ging es darum, Zellen einzufärben und sie später unter dem Mikroskop zu fotografieren. Alles in allem war das also ein sehr interessanter Tag.

Am Montag habe ich mich – surprise – weiter mit meinen Tooltips beschäftigt. Inzwischen bin ich schon ein regelrechter Tooltipologe geworden, und die Aufgabe Tooltips über verschiedenen Elementen zu erzeugen, war deshalb nicht allzu schwer für mich. Ich sollte Tooltips über normalem Text, über Links, über Tabellen und über Bildern erstellen. Außerdem sollte ich zeigen, dass man die Tooltips auch mit CSS in einer externen Datei gestalten kann und einen Tooltip mit sehr viel Text erstellen, um die Darstellung von großen Tooltips zu überprüfen.
Am Dienstag habe ich meine Arbeit von Montag erweitert. Ich habe sämtliche Aufgaben, die ich oben beschrieben habe, mit allen vier libraries bearbeitet. Eine Ausnahme bildeten overlib und cooltips. Ihre Darstellung wird durch Parameter bestimmt und nicht mit CSS. Deswegen musste ich diese Aufgabe mit diesen beiden libraries auslassen. Abschließend habe ich meine Ergebnisse in einer Excel Tabelle zusammengefasst. Ich habe die Vor- und Nachteile der einzelnen libraries beschrieben, ihre Arbeitsmethode, welche Scripts man braucht, welche Effekte möglich sind und noch einiges anderes.

Da ich ja am Mittwoch damit begonnen habe, mich nach Tooltips umzusehen, die ein bisschen aufregender ausschauen, als die normalen gelben Kästchen, möchte ich diese Aufgabe näher beschreiben. Sie besteht darin, einige libraries wie script.aculo.us herauszusuchen, mit denen man Tooltips gestalten kann und jeweils ein Beispiel damit vorzubereiten. Ich habe mich für vier libraries entschieden: qTip, coolTips, overLIB und jQuery-Tooltips. Angefangen habe ich mit qTip, und es funktioniert auch schon so, wie ich mir das vorgestellt habe.
Aber dieser Tag war auch noch aus einem zweiten Grund sehr abwechslungsreich: Wir Informatik-Summerschoolstudenten haben eine Einführung in das Zellkulturlabor erhalten. Es war wirklich interessant, und eine angenehme Erholung von der Fehlersuche am Bildschirm. Nachdem wir sogar selbst ein paar Dinge ausprobieren durften, ging es wieder zurück zu meinen Tooltips.
Auch am Freitag war das meine Beschäftigung. Ich habe es inzwischen geschafft, auch die anderen drei Beispiele zum Laufen zu bringen. Wer wissen möchte, wie das ausschauen sollte, kann sich ja das hier einmal ansehen: http://www.acooltip.com/
Man kann diese libraries in sein Script inkludieren, und mit einer Funktion schließlich aufrufen. Aber trotzdem bestehen zwischen den einzelnen Angeboten Unterschiede. Mit coolTips zum Beispiel ist es möglich, zwei Tooltips auf den gleichen Link zu setzen, während man mit jQuery unter anderem auch Bilder in seine Tooltips setzen kann.

Am Dienstag habe ich meinen Autocompleter noch etwas verfeinert und Edith hat mir auch die Ursache der Probleme mit dem Internet Explorer gezeigt. Vor allem die Scrollbars mussten angepasst werden, da es nicht besonders schön ist, eine horizontale Scrollbar zu haben, die keinerlei Nutzen hat, da ich in meinem Dropdown – Menü ja keine zu langen Einträge habe. Außerdem werden jetzt die Einträge, über die der Benutzer mit der Maus fährt, größer und unterlegt angezeigt. So schaut es nicht nur besser aus, sondern ist auch praktischer als vorher.
Es gibt zwei Arten von Autocompletern, die man mit Scriptaculous machen kann. Die eine habe ich beim letzen Beispiel verwendet, man nennt sie Local Autocompleter. Das heißt, die Daten, die dem Benutzer vorgeschlagen werden sollen, sind im gleichen File notiert wie der Autocompleter. Da das für größere Listen nicht durchführbar ist, gibt es noch einen zweiten Autocompleter. Er heißt Ajax Autocompleter und kann auf Daten aus einer anderen Datei zugreifen. Das heißt normalerweise, dass er auf ein php-Script zugreift, welches die geforderten Einträge aus einer Datenbank holt und zurückschickt. Auf diesem Prinzip basiert auch GoogleSuggest.
Mein Ajax Autocompleter hat natürlich keine Datenbank zur Verfügung, deshalb habe ich einfach eine Liste mit eigenen Daten in eine andere Datei geschrieben. Diese unordered list erscheint, sobald der Benutzer irgendwelche Buchstaben eingibt. Das war auch zum Großteil schon meine Beschäftigung für Mittwoch, außer dass ich das Stylesheet für meine beiden Autocompleter noch etwas angepasst habe. Dabei habe ich für die Listen, die ausgegeben werden sollen und für die Inputfelder Klassen definiert, damit durch das Stylesheet nicht alle Listen, bzw. Inputfelder verändert werden, sondern nur bestimmte.
Außerdem habe ich noch eine neue Aufgabe bekommen, nämlich verschiedene Möglichkeiten herauszusuchen, wie man mit Ajax Tooltips erstellen kann. Das wird mich noch einige Zeit beschäftigen ;-)

Am Donnerstag habe ich noch ein paar Übungen zum Thema Javascript und CSS gemacht, aber schon am Freitag habe ich damit begonnen, mich mit der Seite script.aculo.us zu beschäftigen. Der Download auf dieser Seite bietet die Möglichkeit das User Interface einer Website interessanter zu gestalten. Man kann damit zum Beispiel autocompleting text fields, sortable lists oder verschiedene Effekte wie appear oder blind down verwenden. Der Witz dabei ist, dass sich dadurch Dinge auf der Seite verändern lassen, ohne gleich die ganze Seite neu laden zu müssen. Wer sich dafür interessiert, kann sich ja einmal diesen Link anschauen, hier findet man einige Demos:
http://wiki.github.com/madrobby/scriptaculous/demos
Meine Aufgabe am Freitag war, mich mit diesen Effekten vertraut zu machen und einen Schrifteffekt (shake), eine Drag&Drop – Aufgabe und eine sortable list zu programmieren.
Heute habe ich ein autocompleting text field erstellt, bei dem ich einige Dinge beachten musste. Das Wichtigste war, dass es bei einem Eintrag des Benutzers Vorschläge mit dem eingegebenen Anfangsbuchstaben macht. Nachdem ich das geschafft habe, war die nächste Aufgabe die Aufzählungszeichen dieser Liste zu entfernen, die Liste in einem Feld erscheinen zu lassen und die Einträge nicht zentriert darzustellen. Zwar funktioniert im Mozilla Firefox alles, aber es gibt noch einige Probleme mit dem Internet Explorer. Vielleicht erfahre ich ja morgen, woran das liegt.

Leider bin ich gestern nicht mehr dazu gekommen, noch einen Eintrag zu schreiben, aber das hole ich jetzt nach und fasse gleich zwei Tage zusammen.
Gestern habe ich mich mit CSS beschäftigt und wieder einige Übungsbeispiele programmiert. Außerdem habe ich die anderen im Institut kennen gelernt, da ich bei einer Runde durch die Büros allen vorgestellt worden bin.
Heute habe ich dann mit Javascript begonnen und mich ausführlich über DOM informiert.
Im Institut ist es Brauch, dass jeden Mittwoch jemand anderes einen so genannten „Social Lunch“ organisiert. Heute durfte ich zum ersten Mal daran teilnehmen und das Essen war wirklich ausgezeichnet!

Hier findest du Platz für deine Forschungsdokumentation.