Script-Librarys in Protogrid sind ein mächtiges Instrument, um Applikationen komfortabel den eigenen Bedürfnissen anzupassen. Bereits mit wenig Java-Script-Code kann in kurzer Zeit eine spezifische Geschäftslogik implementiert werden. Im Folgenden werden deren Möglichkeiten anhand eines einfachen Beispiels demonstriert.

Dabei soll die Anforderung umgesetzt werden, in einer Ansicht nur Cards darzustellen, welche bestimmte Filterkriterien erfüllen. Eine einfache Lösung dafür ist, eine TableView zusammen mit einem Relationen-Feld in einer Card zu platzieren, sodass die Anzeige der TableView durch das Relationen-Feldes eingeschränkt wird. Wenn sich jetzt aber das Filterkriterium überhaupt nicht ändern soll, beansprucht das Relationen-Feld nur unnötigen Platz. Es stört Power-User und verwirrt unerfahrene Nutzer. Mit Hilfe einer Script-Library kann das Relationen-Feld kurzerhand versteckt werden. Zusätzlich muss dann das Filterkriterium programmatisch in das Relationen-Feld geschrieben werden, da dieses ja im User-Interface nun nicht mehr zugänglich ist.

Kommen wir gleich zur Praxis und erstellen einfach einmal eine neue Script-Library:

Protogrid kommt uns gleich zur Hilfe und generiert ein Funktionsgerüst gewürzt mit Kommentaren, Erklärungen und Beispielen. Vorerst werden wir der neuen Script-Library nur einen Namen geben, diese abspeichern und schliessen.

Als Nächstes müssen wir für die gewünschte, spezifisch gefilterte Ansicht einen neuen Proto erstellen. Auch diesem geben wir einen sinnvollen Namen und linken die gerade erstellte Script-Library ein. Wenn wir den Proto nun abzuspeichern und schliessen, bemerken wir, dass Protogrid gleich zwei Protos generiert hat: Einen Utility- und einen Übersichts-Proto. Wir öffnen den letzteren um dessen TableView-Definition anzupassen. Diese soll nämlich in Zukunft jene Cards anzeigen, welche wir in der neuen Ansicht wünschen. Dazu müssen wir einzig deren Proto unter “Verknüpfter Proto” einstellen:

Nun speichern wir die TableView-Definition ab und schliessen sie. Immer noch im neu erstellten Übersichts-Proto, erstellen wir ein neues Relationen-Feld und kümmern uns um die Einstellungen, welche im folgenden Screenshot rot markiert sind:

1) Wir beschriften das neue Relationen-Feld mit dem Filterkriterium. Dies dient nur uns als Gedächtnisstütze, da das Relationen-Feld für Benutzer versteckt sein wird.

2) Das Feld ist “berechnet” – wir wollen es ja später mittels Script-Library programmatisch setzen.

3) Da die Daten in diesem Relationen-Feld für das User-Interface irrelevant sind, setzen wir die Darstellungspriorität auf 0.

4) Hier muss der Proto des Filterkriteriums ausgewählt werden, damit dieses auch in den Auswahlmöglichkeiten des Relationen-Feldes enthalten sein wird.

5) Dann müssen wir uns noch die Card-ID dieser Relationen-Feld-Definition merken, welche wir mittels Klick auf “Diese Card” und “Zeige Eigenschaften” herausfinden.

Ganz zum Schluss geht es endlich ans Programmieren. Wir öffnen die eingangs erstellte Script-Library und kopieren den untenstehenden Code hinein. Anzupassen sind lediglich die ersten beiden Variablen-Zuweisungen, welche durch die Card-ID der Relationen-Feld-Definition und der Card-ID des Filterkriteriums ersetzt werden müssen.

function script_library() {
	    // Card-ID der Relationen-Feld-Definition
	    var card_id_relationen_feld = "5b1e87ac-cf4a-4243-8199-7be687a0146b";
	    
	    // Card-ID des Filterkriteriums
	    var card_id_filter_kriterium = "754be2fd-1051-4e6c-9ab2-0f2314836e3d";
	    
	    // Filterkriterium in das Relationen-Feld setzen und dieses verstecken
	    function on_render(card, before_first_save) {
	        card.set_element_value(card_id_relationen_feld, card_id_filter_kriterium, false);
	        var design_element_org = card.get_design_element(card_id_relationen_feld);
	        if(typeof(design_element_org) === 'object') {
	        design_element_org.hidden_in_client = true;
	        }
	    }
	    
	    // Übergabe der Render-Funktion an Protogrid
	    return {
	    on_render: on_render
	    };
	}

Jetzt sind wir fertig – unsere Protogrid Applikation wurde erfolgreich um eine benutzerdefinierte Funktionalität erweitert. Setzen Sie nun Ihre eigenen Ideen mit den unzähligen weiteren Schnittstellen und Funktionen von Script-Librarys um und teilen Sie hier Ihre Erfahrungen!