contentbuilder docs

api/collections/fields/content.yml

@@ -0,0 +1,113 @@
+# Der Name des Feldes ist natürlich beliebig wählbar.
+name: content
+
+# "string" als Datentyp ist zwingend.
+type: string
+
+meta:
+    label:
+        de: Inhalt
+        en: content
+
+    # Die Bezeichnung des ContentBuilder-Widgets ist "contentbuilder".
+    widget: contentbuilder
+
+    # Die Anzeige des ContentBuilder im tibi-admin geschieht innerhalb
+    # eines iframes. Das ist notwendig, da der ContentBuilder eigene 
+    # Styles mitbringet, die sich nicht mit den Styles des tibi-admin
+    # vermischen sollten.
+
+    # Via "baseHref" wird der <base>-Tag im iframe gesetzt.
+    # somit können alle relativen Pfade im ContentBuilder (z.B. Bilder)
+    # aufgelöst werden.
+    # Wie man hier sieht, ist die Angabe via "eval" mittels möglich.
+    # Der Kontext ist auf Feldebene, wie bei "dependsOn" und "defaultValue".
+    # Alternativ kann die Angabe auch direkt als String erfolgend.
+    # Dann natürlich ohne die Evaluierung der Variable "$projectBase", wie hier.
+    baseHref:
+        eval: $projectBase
+
+    # Sollen weitere CSS-Datei in das iframe geladen werden, können diese
+    # hier aufgelistet werden.
+    # Die Angabe kann direkt als Array erfolgen oder via "eval", dessen
+    # Code das Array der Strings mit den Dateipfaden zurückgibt.
+    # Auch zu beachten ist hier die relative Angabe. Da "baseHref" gesetzt
+    # ist, wird der Pfad relativ zu dieser Projekt-Basis innerhalb des
+    # tibi-server aufgelöst.
+    # Die Auslieferung der CSS-Dateien direkt über den tibi-server kann
+    # nur funktionieren, wenn "_dist_" in der "assets" Konfiguration der
+    # "config.yml" definiert ist.
+    cssHref:
+        - _/assets/_dist_/index.css
+
+    # Um eine Kollektion stellvertretend als Mediathek anzubinden, sind die 
+    # Angaben unter "imageSelect", "fileSelect" und "videoSelect" zu tätigen.
+    # "imageSelect" betrifft die Einbindung von Bildern, "fileSelect" die
+    # Einbindung von Dateien, "videoSelect" die Einbindung von Videos.
+    imageSelect:
+
+        # Die Angabe "collection" ist zwingend. Hier wird die Kollektion
+        # definiert, die als Sammlung für die Bilder/Datei dient.
+        # Der Aufbau der Kollektion ist dabei frei, solange ein Upload-Feld
+        # für die Dateien existiert, welches die URL zur Datei zurückgibt.
+        collection: medialib
+
+        # Optional kann ein Filter und View für die Einbindung der Bilder/Dateien
+        # definiert werden. Dies geschieht über einen "subNavigation" 
+        # Eintrag innerhalb des "meta.subNavigation" Arrays, der Kollektion
+        # (hier bei "medialib").
+        # Die Angabe hier ist die auszuwählende Navigation per Index des Arrays.
+        subNavigation: 0
+
+    fileSelect:
+        collection: medialib
+        subNavigation: 0
+    videoSelect:
+        collection: medialib
+        subNavigation: 0
+
+    # "customTags" des ContentBuilder können verwendet werden um die Einbindung
+    # von Modulen ins HTML zu ermöglichen.
+    # Die folgende Auflistung ist dabei ein Beispiel für ein Modul.
+    customTags:
+
+        - # Der Platzhalter wird 1:1 ins HTML übernommen und ist dabei frei
+          # definierbar.
+          # Die eigentliche Funktion eines Modul-Systems muss dann später
+          # im Frontend implementiert werden.
+          placeholder: "<my-module class='tibi-module' title='Titel' description='Beschreibung'>Mein Modul</my-module>"
+
+          # Die Benennung für die UI des ContentBuilder geschieht über die
+          # "label" Angabe, die mehrsprachig erfolgen kann.
+          label: 
+            de: "Mein Modul"
+            en: "My Module"
+
+    # Um direkt Style-Angaben in das iframe des ContentBuilder zu übernehmen,
+    # werden diese hier angegeben.
+    # Natürlich ist auch hier wieder die Angabe via "eval" möglich.
+    # Nachfolgendes Beispiel erzeugt im ContentBuilder eine deutliche Darstellung
+    # des eingebundenen Moduls.
+    style: |
+        /*css*/
+        .tibi-module {
+            padding: 10px;
+            border: 3px dashed #c4c4c4;
+            display: block;
+            text-align: center;
+            font-size: 14px;
+            color: black;
+        }
+        .tibi-module::before {
+            content: "\1F5BD  ";
+            font-size: 16px;
+            color: black;
+        }
+        .tibi-module::after {
+            content: "  title=\"" attr(title) "\" description=\"" attr(description) "\"";
+            font-size: 10px;
+            color: #555;
+            display: block;
+            padding-top: 5px;
+        }
+        /*!css*/ 

api/collections/fields/date.yml

@@ -38,7 +38,7 @@ meta:
     # Abgelkeitet vom "type" gibt es Standard-Widgets. für spezielle
     # Aufgaben stehen aber eine Hand voll Widgets bereit, die später
     # beschrieben werden.
-    widget: text
+    widget: date
 
     # Standardwerte für neue Enträge können entweder direkt angegeben
     # werden oder via Javascript client-seitig generiert werden.
@@ -54,4 +54,4 @@ meta:
         # Das Feld wird nur eingeblendet wenn der Wert von "type"
         # (auf gleicher Ebene wie das Feld "date" selbst)
         #  gleich "news" ist.
-        eval: $parent.type == "news"
+        eval: $parent?.type == "news"

api/collections/fields/info.yml

@@ -0,0 +1,13 @@
+name: info
+type: object
+meta:
+    label:
+        de: Info
+        en: Info
+subFields:
+    - name: author
+      type: string
+      meta:
+          label:
+              de: Autor
+              en: Author

api/collections/fields/title.yml

@@ -0,0 +1,6 @@
+name: title
+type: string
+meta:
+    label:
+        de: Titel
+        en: Title

api/collections/fields/type.yml

@@ -0,0 +1,16 @@
+name: type
+type: string
+meta:
+    label:
+        de: Typ
+        en: Type
+    widget: select
+    choices:
+        - name: 
+            de: Standardseite
+            en: Standard page
+          id: page
+        - name: 
+            de: News
+            en: News
+          id: news