imageFilter

api/collections/democol.yml

@@ -2,6 +2,9 @@
 # /_/demo/democol
 name: democol
 
+# Standardsprache für Text-Index in der Datenbank
+defaultLanguage: de
+
 # Enthält die Kollektion Felder vom Typ "file", so werden die
 # hochgeladenen Dateien unter dem Ordner abgelegt, der mit
 # "uploadPath" bestimmt wird.

api/collections/democol/imageFilter.yml

@@ -0,0 +1,25 @@
+# Der Key des Objektes definiert den Namen des Filters.
+# Jeder Filter ist eine Liste von Bildmanipulationen, die
+# nacheinander angewandt werden.
+# Die manipulierten Bilder werden gecachet. Ein nachträgliches
+# Anpassen der Filter erfordert also das Löschen der gecachten
+# Dateien welche sich jeweils neben den original Bilddateien
+# im "uploadPath" der Kollektion befinden.
+s:
+    - fit: true
+      height: 300
+      width: 300
+      resampling: lanczos
+      quality: 60
+m:
+    - fit: true
+      height: 600
+      width: 600
+      resampling: lanczos
+      quality: 60
+l:
+    - fit: true
+      height: 1200
+      width: 1200
+      resampling: lanczos
+      quality: 60

api/collections/democol/meta.yml

@@ -68,3 +68,10 @@ subNavigation:
           - !include table.yml
       filter:
           type: news
+
+# Standardmäßig werden im Formular zu Eingabe der Daten alle Felder von "fields"
+# untereinander angeordnet.
+# Um diese Anordnung in Tabs zu strukturieren, ist die Verwendung von "tablist"
+# vorgesehen.
+# Die Definition befindet sich in einem gesonderten Kapitel
+tablist: !include democol/tablist.yml

api/collections/democol/simpleList.yml

@@ -0,0 +1,19 @@
+# "type" legt den Typ des Views fest.
+type: simpleList
+# Die Auswahl erfolgt über folgende "mediaQuery".
+# (hier also bis maximal 599px Fensterbreite)
+mediaQuery: "(max-width:599px)"
+
+# 3 Blöcke können in der simpleList verwendet werden.
+# Haupttext "primaryText" und optional 2 weitere Angaben über
+# "secondaryText" und "tertiaryText".
+# Die Angabe des jeweiligen Feldes erfolgt als String oder
+# Objekt mit der "source"-Eigenschaft.
+# Das Feld selbst wird in Punkt-Notation angegeben.
+# Die Darstellung selbst ist abhängig von der Feld-Konfiguration
+# selbst, die unter fields in der Kollektions-Konfiguration
+# stattfindet.
+primaryText: title
+secondaryText:
+    source: date
+tertiaryText: meta.author

api/collections/democol/table.yml

@@ -0,0 +1,14 @@
+type: table
+mediaQuery: "(min-width:600px)"
+columns:
+    - source: updateTime
+      label: 
+        de: letztes Update
+        en: last update
+      type: date
+    - source: title
+      filter: true
+    - source: date
+      filter: true
+    - source: type
+      filter: true

api/collections/democol/tablist.yml

@@ -0,0 +1,24 @@
+# Hier wird der initial zu öffnende Tab festgelegt.
+# Ist dieser nicht festgelegt, wird automatisch der erste Tab
+# aus der "tabs" Liste gewaählt.
+activeTab: general
+# "tabs" ist die eigentliche Liste
+tabs:
+    - # Jeder Tab braucht einen Namen, über den er refereziert
+      # werden kann.
+      name: general
+      # Die übliche Labelangabe kann auch hier mehrpsrachig erfolgen.
+      label:
+          de: Allgemein
+          en: General
+      # Welche Felder dieser Tab anzeigen soll, wird über "subFields"
+      # beschrieben.
+      subFields:
+          - source: title
+          - source: date
+    - name: meta
+      label:
+          de: Metaangaben
+          en: Meta data
+      subFields:
+          - source: meta.author

docs/projektkonfig/collections.md

@@ -11,6 +11,9 @@ Eine solche Datei (z.B. democol.yml) hat folgenden Aufbau:
 # /_/demo/democol
 name: democol
 
+# Standardsprache für Text-Index in der Datenbank
+defaultLanguage: de
+
 # Enthält die Kollektion Felder vom Typ "file", so werden die
 # hochgeladenen Dateien unter dem Ordner abgelegt, der mit
 # "uploadPath" bestimmt wird.
@@ -213,7 +216,61 @@ fields:
 
 ## imageFilter Objekt
 
-TODO
+Die Bildmanipulation von hochgeladen Bildern zu einer Kollektion kann über das "imageFilter" Objekt definiert werden.
+Der Filter wird angewandt, wenn an die Bild-URL der Parameter "filter=..." angehangen wird.
+
+Der Prozess selbst erfolgt beim ersten Abruf des Bildes und wird zwischengespeichert.
+
+Eine beispielhafte Konfiguration, die die Bilder nur verkleinert sieht so aus:
+
+```yaml
+# Der Key des Objektes definiert den Namen des Filters.
+# Jeder Filter ist eine Liste von Bildmanipulationen, die
+# nacheinander angewandt werden.
+# Die manipulierten Bilder werden gecachet. Ein nachträgliches
+# Anpassen der Filter erfordert also das Löschen der gecachten
+# Dateien welche sich jeweils neben den original Bilddateien
+# im "uploadPath" der Kollektion befinden.
+s:
+    - fit: true
+      height: 300
+      width: 300
+      resampling: lanczos
+      quality: 60
+m:
+    - fit: true
+      height: 600
+      width: 600
+      resampling: lanczos
+      quality: 60
+l:
+    - fit: true
+      height: 1200
+      width: 1200
+      resampling: lanczos
+      quality: 60
+
+```
+
+Folgende Attribute können Filter-Eintrage haben, wobei "fit" und "fill" exklusiv sind:
+
+| Attribut | Typ | Beschreibung |
+| --- | --- | --- |
+| fit | boolean | passt das Bild in ein Rechteck ein |
+| fill | boolean | streckt/staucht das Bild, so dass es das Rechteck komplett ausfüllt |
+| height | number | Höhe des Rechtecks |
+| width | number | Breite des Rechtecks |
+| blur | number | Verwischungsgrad |
+| brightness | number | Helligkeit |
+| contrast | number | Konrast |
+| gamma | number | Gamma-Wert |
+| saturation | number | Sättigung |
+| sharpen | number | Schärfe |
+| invert | boolean | Farben invertieren |
+| grayscale | boolean | Schwarz-Weiß |
+| resampling | "lanczos"<br>"nearestNeighbor"<br>"linear"<br>"catmullRom" | Resampling-Algorithmus |
+| quality | number | Ausgabequalität 0..100 |
+
 
 
 ## meta Objekt
@@ -294,10 +351,110 @@ subNavigation:
       filter:
           type: news
 
+# Standardmäßig werden im Formular zu Eingabe der Daten alle Felder von "fields"
+# untereinander angeordnet.
+# Um diese Anordnung in Tabs zu strukturieren, ist die Verwendung von "tablist"
+# vorgesehen.
+# Die Definition befindet sich in einem gesonderten Kapitel
+tablist: !include democol/tablist.yml
+
 ```
 
 ### views Liste
 
+"views" werden für die Darstellung der Kollektion-Daten in der Admin-UI benötigt. Die Auswahl des passenden View erfolgt über CSS Media-Queries.
+
+Optionale Unternavigationen können eigene "views" haben.
+
+Folgende Views gibt es derzeit:
+
 #### simpleList
 
-#### table
+```yaml
+# "type" legt den Typ des Views fest.
+type: simpleList
+# Die Auswahl erfolgt über folgende "mediaQuery".
+# (hier also bis maximal 599px Fensterbreite)
+mediaQuery: "(max-width:599px)"
+
+# 3 Blöcke können in der simpleList verwendet werden.
+# Haupttext "primaryText" und optional 2 weitere Angaben über
+# "secondaryText" und "tertiaryText".
+# Die Angabe des jeweiligen Feldes erfolgt als String oder
+# Objekt mit der "source"-Eigenschaft.
+# Das Feld selbst wird in Punkt-Notation angegeben.
+# Die Darstellung selbst ist abhängig von der Feld-Konfiguration
+# selbst, die unter fields in der Kollektions-Konfiguration
+# stattfindet.
+primaryText: title
+secondaryText:
+    source: date
+tertiaryText: meta.author
+
+```
+
+#### table
+
+```yaml
+type: table
+# Dieser View wird ab einer Fensterbreite von 600px angezeigt.
+mediaQuery: "(min-width:600px)"
+# Da es sich um eine Tabelle handelt, benötigt es eine Auflistung
+# der Spalten unter "columns
+columns:
+    # Jede Spalte zeigt auf ein Feld.
+    # Entweder wird hier nur der String des Feldes in Punk-Notation
+    # angegeben oder ein Objekt mit weiteren Möglichkeiten
+    - # "source" definiert das Feld via Punkt-Notation.
+      source: updateTime
+      # Mit "label" kann das Label aus der Feld-Konfiguration
+      # überschrieben werden.
+      label: 
+        de: letztes Update
+        en: last update
+      # Ebenso kann der "type" der Feldkonfiguration überschrieben
+      # werden oder gesetzt werden, wie in diesem Fall, da "updateTime"
+      # ein Standardfeld der Kollektion ist und nicht in der "fields"-Liste
+      # konfiguriert wird.
+      type: date
+    - source: title
+      # Mit "filter: true" wird festegelegt, dass über diese Spalte
+      # die Daten filterbar sind.
+      filter: true
+    - source: date
+      filter: true
+    - source: type
+      filter: true
+```
+
+### tablist
+
+Wird die "tablist" verwendet, ist sicher zu stellen, dass alle Felder in der Definition aufgenommen werden. Werden Felder nicht in die "tablist" aufgenommen, sind diese weiterhin in einer Gesamtliste unterhalb der Tabs und bringen das Layout durcheinander.
+
+```yaml
+# Hier wird der initial zu öffnende Tab festgelegt.
+# Ist dieser nicht festgelegt, wird automatisch der erste Tab
+# aus der "tabs" Liste gewaählt.
+activeTab: general
+# "tabs" ist die eigentliche Liste
+tabs:
+    - # Jeder Tab braucht einen Namen, über den er refereziert
+      # werden kann.
+      name: general
+      # Die übliche Labelangabe kann auch hier mehrpsrachig erfolgen.
+      label:
+          de: Allgemein
+          en: General
+      # Welche Felder dieser Tab anzeigen soll, wird über "subFields"
+      # beschrieben.
+      subFields:
+          - source: title
+          - source: date
+    - name: meta
+      label:
+          de: Metaangaben
+          en: Meta data
+      subFields:
+          - source: meta.author
+
+```