Beim ersten Öffnen einer mam/gallery Oberfläche wird automatisch ein Datensatz in der Tabelle 2019-05-07_10-29-32_.Bildergalerie v5.3#base/galleryConfiguration (Konfiguration der Bildergalerie) mit einem Konfigurations-Schlüssel angelegt.
Anker
Konfiguration
| Bereich | Beschreibung | |||||
|---|---|---|---|---|---|---|
| Konfigurations-Schlüssel | Sobald man eine mam/gallery Oberfläche zum ersten Mal in einem Plugin öffnet, wird automatisch für dieses Plugin ein Datensatz in der Tabelle 2019-05-07_10-29-32_.Bildergalerie v5.3#base/galleryConfiguration (Konfiguration der Bildergalerie) angelegt. Der Konfigurations-Schlüssel wird dabei mitgeliefert und automatisch in den Datensatz mit eingeschrieben. Im Konfigurations-Schlüssel steckt der Name des Plugins. Wenn beispielsweise im Konfigurations-Schlüssel "base-shopArticle" steht, weis man genau dass es sich um shop/Article handelt. Da jedes Plugin seinen eigenen Konfigurations-Schlüssel besitzt und jeder Schlüssel einzigartig ist, kann man das Plugin leicht identifizieren. Wenn es bereits einen Datensatz in der Tabelle mit dem Konfigurations-Schlüssel gibt, wird dieser nur noch aufgerufen und nicht neu generiert. Mit Hilfe des Konfigurations-Schlüssels ist 2019-05-07_10-29-32_.Bildergalerie v5.3#base/galleryConfiguration natürlich auch manuell konfigurierbar. Hier sind alle Konfigurations-Schlüssel aufgelistet: Konfigurations-Schlüssel: ListeEine Zeichenkette, die über die HTTP-Parameter an den Server übertragen wird, damit die entsprechende Galerie genutzt werden kann. | |||||
| Zeige Dateien die keine Bilder sind | Dateien die keine Bilder sind, werden bei einer aktivierter Checkbox auch eingeblendet. | |||||
| Primärer Ordner | Ein wählbarer Ordner in der Tabelle mam. Der Ordnerpfad wird wie folgt angegeben: share/public/client-X/domain-X/Ordnername/ client-X steht für den Client, wodurch das X durch eine Zahl ersetzt wird. domain-X steht für die Domain, X wird ebenfalls durch eine Zahl ersetzt. Ordnername ist der Hauptordner. Dateien, welche sich im Hauptordner (Hauptpfad) befinden, werden später in der mam/gallery Oberfläche angezeigt. Beim eintragen von "share/public/client-1/domain-1/none" werden Dateien keiner Ordner von angezeigt. | |||||
| Sekundärer Ordner | Ein Ordner, der in der Gallerie zusätzlich zur Auswahl steht. | |||||
| Manuelle Ordner-Angabe | Eine Pfadangabe zu einem Ordner. Hier können Wildcards benutzt werden | . Dieser Wert überschreibt den primären Ordner. Weitere Informationen sind im Tooltip des Feldes vorhanden. | ||||
| Sekundärer Ordner | Ein Ordner, der in der Gallerie zusätzlich zur Auswahl steht. | |||||
Zeige meine Dateien | Ist diese Checkbox aktiviert, wird in der mam/gallery Oberfläche ein Button aktiviert, welcher Zugriff zum Auswählen von Dateien gibtist es dem Nutzer möglich, auf die Dateien zuzugreifen, die von Ihnen , bzw. vom aktuell angemeldeten Benutzer hochgeladen hochgeladenen Dateien wurden. Diese Dateien müssen nicht unbedingt im Hauptpfad liegen, um dort angezeigt zu werden.
| |||||
| Zeige Dateien aus Kategorien | Bei Aktivierung dieser Checkbox wird der Button "Kategorien" eingeblendet. Die Kategorien befinden sich nicht im Hauptpfad und werden immer angezeigt sobald die Checkbox aktiviert ist. | Zeige Dateien aus dem primären Ordner | Bei aktiver Checkbox wird der Hauptpfad in der mam/gallery Oberfläche sichtbar als "Ordner" angezeigt. Sie können dann Dateien vom Hauptpfad auswählen. Der Hauptpfad ist dieser, welchen Sie oben definiert haben. | |||
Zeige Dateien aus dem sekundären Ordner | Bei aktiver Checkbox wird zusätzlich zu dem primären Ordner auch der sekundäre Ordner angezeigt. | |||||
| Zeige Dateien die keine Bilder sind | Dateien die keine Bilder sind, werden bei einer aktivierter Checkbox auch eingeblendet. | |||||
| Zeige nur die Dateien des primären Ordners | Hier werden nur Dateien angezeigt die sich im Hauptpfad befinden. Dateien die sich in einem Unterordner des Hauptpfades befinden werden hierbei ausgeblendet. Bei aktiver Checkbox werden die Buttons "Zeige meine Dateien", "Zeige Kategorien" und "Zeige Hauptpfad" ausgeblendet, und nur die Dateien des Hauptpfades sind sichtbar. | |||||
| Anzahl Datensätze pro Seite | Mit dieser Option können Sie x Datensätze (Dateien) pro Seite anzeigen lassen. Ist die Anzahl pro Seite niedriger als Dateien insgesamt angezeigt werden können, wird eine Seitenauswahl angezeigt, mit der Sie auf einzelne Seiten springen können. | |||||
| Weitere Dateien | Über dieses Auswahlfeld wird festgelegt, wie die Optionen für "weitere Dateien" dargestellt werden.
Standardmäßig wird die Pagination dargestellt, sofern keine Option gewählt wurde. |
Konfigurations-Schlüssel zu mam/gallery:
- base-cmsCareerEntry
- base-cmsEventsEntry
- base-cmsNewsEntry
- base-mamFile
- base-mamFolder
- base-mamFormatPreset
- base-shopArticle
- base-shopArticleTemplate
- base-shopDeliveryMethod
- base-shopGroup
- base-shopOrderArticle
- base-shopSessionArticle
- base-shopVariantAttribute
- cms-ui
- w2p-h5e
- w2p-mail
- w2p-nested
- w2p-strict
...
Verwendung
Wenn Sie sich zum Beispiel in einem Artikel (in shop/Article) befinden, können Sie im Datensatz mit einem Klick auf "Dateien" eine Datei auswählen.
...
| Zeige Dateien aus Kategorien | Ist die Checkbox aktiv, ist der Abruf der Kategorien in der Galerie möglich. |
Um die Konfiguration der Galerie zu erweitern, sollten weitere Entitäten erstellt werden, die einen Fremdschlüsselbezug zu einem Galeriedatensatzes besitzen. Die Konfigurationsoberfläche kann über das OnPopulateForm-Event von ComponentForm erweitert werden.
Verwendung
Die Galerie kann über den entsprechenden Button eines Datei-Feldes geöffnet werden. Die Galerie wird dabei in einem Modal platziert.
Die Galerie ist standardmäßig aus folgenden Elementen aufgebaut.
| Nr. | Bereich | Beschreibung |
|---|---|---|
| 1 & 2 | Marginalie - Buttons |
|
| 2 | Marginalie - Rekursiver Baum | 2do |
Toolbar & Baum | Die Organisationseinheiten einer Galerie können über entsprechende Ui-Elemente in der Toolbar, oder im rekursiven Baum dargestellt werden. Je nach Kontext, sollte der Programmierer eine passende Darstellung wählen. | |
| 3 | Blätterfunktion | Wenn sich viele Dateien im Hauptpfad befinden, bzw. mehr Dateien wie in der Konfiguration "Anzahl Datensätze pro Seite" angegeben, können Sie hier auf verschiedene Seiten springen. Falls es nur eine Seite gibt, wird die Seitenauswahl nicht angezeigt. Es ist möglich die Blätterfunktion durch einen "Mehr"-Button zu ersetzen, der weitere Kacheln nachlädt, sofern weitere Elemente vorhanden sind. |
| 4 | Dateisuche | Mit dieser Option können Sie nach Dateien suchen indem Sie den Namen eingeben, oder Buchstaben und Zahlen, welche der Dateinamen enthält. Das suchen nach Dateiendungen (z.B. ".jpg", ".png", ...) ist ebenfalls möglich. Danach einen Klick auf die Enter-Taste um die Suche zu starten. Die Dateien werden Ihnen rechts im großen Feld angezeigt. |
| 5 | Sortierung | Hier kann die Sortierung gewählt werden. Es werden alle Spalten aufgelistet, die als Sortierspalten gekennzeichnet sind und keine Systemspalten sind. |
| 6 | Sichtbare Werte | Hier können die Werte gewählt werden, die in den Kacheln sichtbar sein sollen. Die Einstellung wird im WebStorage persistiert. Die Sortierung ist in der Parameterliste bei Anfragen an die Galerie vorhanden und muss von den Listenern/Subscribern, welche die Dateien aus der Datenbank beschaffen, entsprechend verarbeitet werden. |
| 7 | Datei-Kachel | Die Kachel besteht aus mehreren Unterelementen.
|
Hier ein Beispiel, wenn sich keine Dateien im Hauptpfad befindet, bzw. keine Dateien gefunden werden konnten. Die Seitenauswahl ist ausgeblendet und eine entsprechende Meldung mit dem Text "Keine Dateien vorhanden" wird angezeigt.
Aktionen
Im Kopfbereich der Galerie lassen sich unter Umständen Buttons finden, über die bestimmte Aktionen ausgeführt werden können.
...
Die Galerie besitzt grundlegend drei zwei Einsteigspunkte:
Ui/Modal/Engine::galleryUi/Modal/Engine::gallery/margin- Haupteinstiegspunkt. Diese Methode liefert die Galerie als Ganzes aus.
UI/Modal/Engine::pwa/gallery/files/wrapper- Diese Methode ist für den Hauptbereich zuständig. Wird ein Element einer Organisationseinheit gewählt, wird der Hauptinhalt entsprechend aktualisiert.
gallery
Den Haupteinstiegspunkt bildet gallery. Wird diese Methode aufgerufen, wird der Rahmen für die Galerie platziert. Die Marginalie bzw. der Hauptbereich werden nachgeladen.
...
| Drawio | ||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
|
...
Marginalie
Die Marginalie wird über den Aufruf gallery/margin nachgeladendie Methode Ui\Modal\Manager::buildMargin erstellt. In der Marginalie befinden sich Elemente, die der Navigation dienen. Diese Elemente geben an, was im Hauptbereich dargestellt wird.
Im "Header" Kopfbereich der Marginalie können Buttons aus dem Styleguide befindet sich eine Toolbar, in der Buttons platziert werden können. Diese Buttons werden üblicherweise genutzt um die Navigation zu Dateien zu ermöglichen, die keine dahinterliegende Struktur besitzen (z.B. willkürliche Session Dateien).
Im "Body" Körper der Marginalie hingegen werden hingegen strukturierte Organisationseinheiten dargestellt, welche wiederum Dateien enthalten. Ein Beispiel für eine solche strukturierte Organisationseinheit ist eine solche Organisationseinheiten sind Ordner, der die weitere Unterordner besitzt besitzen und explizit über die Konfiguration der Galerie freigegeben wurdewurden.
...
Hauptbereich
Der Hauptbereich wird über den Aufruf gallery/files/wrapper Ui\Modal\Engine::pwaGalleryContent geladen. Während sich die Marginalie mit der Frage beschäftigt, was dargestellt wird, beschäftigt sich der Hauptbereich hingegen damit, wie die vorab "gewählten" Inhalte dargestellt werden. Der Hauptbereich wird wiederum in zwei Bereiche untergliedert.
gallery/request
In ; eine Kopfzeile, in der Steuerelemente angezeigt werden und ein Hauptbereich in dem hauptsächlich die Dateikarten angezeigt werden.
Im Kopfbereich dieser Ansicht werden Elemente platziert, mit denen man die Filterung und Ansichtseinstellungen für die Dateikacheln beeinflussen kann. In diesem Bereich finden sich gängige Funktionen wie z.B. eine Suche oder Sortierungsmöglichkeiten wieder. Die Steuerungsparameter wie z.B. der Suchbegriff des Suchfeldes können über eigene JavaScript-Dateien an das JavaScript von gallery/request galleryRequest übermittelt werden. Wurden die gewünschten Parameter übermittelt, lässt sich eine neue Anfrage für Dateien auslösen. Somit gibt es nur eine zentrale Stelle, welche die Anfragen für die Galerie ausführt. Die in gallery/request galleryRequest platzierten Elemente sind somit möglichst unabhängig voneinander.
gallery/files
Im Hauptbereich werden die auf Basis der im Kopfbereich bereitgestellten Steuerungsparameter gesammelten Dateien in Form von Karten dargestellt. Dieser Aufruf bezieht die geforderten Dateien anhand der Steuerungs- und Filterparameter aus Marginalie und Request, aus der Datenbank und mappt diese zu den Kachel-Objekten aus dem Styleguide.
Events
PHP
Alle Events der Galerie leiten von der abstrakten Klasse GalleryEventAbstract ab. Diese abstrakte Klasse sieht es vor, den Events die Parameter bereitzustellen, welche von fast jedem Listener/Subscriber gebraucht werden.
Diese Parameter sind:
...
Dieser boolesche Parameter steuert die Ausführungslogik des Subscribers. Ist der Parameter "false", wird der Subscriber keine weitere Listener-Logik ausführen.
Wird dieser Wert von einem Listener gesetzt, kann dieser so sicherstellen, dass nach ihm keine weiteren Listener ausgeführt werden.
...
Die Galerie löst die folgenden Events aus, um die Manipulation der Galerie möglich zu machen:
...
Mit diesem Event kann entschieden werden, ob die Marginalie dargestellt werden soll, oder nicht.
(Dieses Event wird wahrscheinlich entfallen, da die Datenstruktur der Konfiguration vor dem Release der v5.6 angepasst werden muss und sich so eine bessere Möglichkeit dieser Steuerung ergeben wird).
...
. Diese Events verfügen über ein Kontext-Objekt, welches alle nötigen Daten beinhaltet.
Folgende Events werden ausgelöst, um die Inhalte der Galerie zu füllen. Es existieren weitere Events, um die Galerie präziser zu manipulieren.
| Event | Beschreibung |
|---|---|
| OnPopulateMargin | Ein Event, um den FrameworkContainer der Marginalie zu füllen. GalleryCore löst in Reaktion auf dieses Event diese weiteren Events aus:
|
| OnPopulateGalleryContent | Ein Even, um den FrameworkContainer des Hauptbereiches zu füllen. GalleryCore löst in Reaktion auf dieses Event diese weiteren Events aus:
|
Ui/Modal implementiert zahlreiche Listener, um die Basisfunktionalität der Galerie bereitzustellen.
Übersicht aller Events
JavaScript
Sämtliche detail-Objekte der Events einer Galerie sollten den String "galleryIdentifier" enthalten, da es möglich ist, dass mehrere Galerien aktiv sind. Dieser Identifier wird zur Unterscheidung benötigt.
...