tibi-docs/api/collections/medialib.yml

# Der Name der Kollektion ist beliebig, aber wird in unserem
# Beispiel vom ContentBuilder als "medialib" referenziert.
name: medialib
uploadPath: ../media/medialib

meta:
    label:
        de: Medienbibliothek
        en: Media Library
    muiIcon: multimedia
    defaultSort:
        field: sort
        order: MANUALLY #alternativ auch ASC und DESC möglich

    # "defaultImageFilter" dient auch hier nur zur Reduzierung der
    # Bildgröße bei der Anzeige im tibi-admin (Listen).
    # Die Bildgröße für die Einbindung ins erzeugte HTML des ContentBuilder
    # hat hiermit nix zu tun.
    defaultImageFilter: s

    multiupload:
        fields:
            - source: description #specify wich fields should be editable in Modal, if property isnt set, then all fields will automatically be selected
        prefilledFields: #specifies wich fields should have a default value, wont be visible to the user, just an informational text for wich fields will recieve an default value.
            - source: title
              defaultValue:
                  eval: |
                      (function(){
                        return "Title" + $file.name
                      })()

    # Wird unter "image-/file-/videoSelect" im ContentBuilder Feld kein
    # "subNavigation" Index definiert, werden auch folgende "views"
    # verwendet.
    views:
        - type: simpleList
          mediaQuery: "(min-width: 0px)"
          selectionPriority: 3 #gibt an, wenn mediaQuery passt, mit welcher priorität es default mäßig ausgewählt sein soll, je niedriger, desto wichtiger
          primaryText:
              source: path
              filter: true

          secondaryText:
              source: title
              filter: true

          tertiaryText:
              source: description
              filter: true

          fileDropArea:
              label:
                  {
                      de: "Ziehen Sie Dateien per Drag and Drop hierher oder klicken Sie, um Dateien auszuwählen.",
                      en: "Drag and drop some files here, or click to upload.",
                  }
              helperText: { de: "Maximale Uploadgröße: 1,54 MB", en: "Maximum upload size: 1.54MB" }
              targetField: file
              pageAsDropArea: true
          columns:
              - source: file
              - source: updateTime
                type: datetime
                label: letztes Update
              - source: title
                filter: true
              - source: description
                filter: true
        - type: table
          mediaQuery: "(min-width: 768px)"
          selectionPriority: 2
          fileDropArea:
              label:
                  {
                      de: "Ziehen Sie Dateien per Drag and Drop hierher oder klicken Sie, um Dateien auszuwählen.",
                      en: "Drag and drop some files here, or click to upload.",
                  }
              helperText: { de: "Maximale Uploadgröße: 1,54 MB", en: "Maximum upload size: 1.54MB" }
              targetField: file
              pageAsDropArea: true
          columns:
              - source: file
              - source: updateTime
                type: datetime
                label: letztes Update
              - source: title
                filter: true
              - source: description
                filter: true

        - type: cardList
          mediaQuery: "(min-width: 1200px)"
          selectionPriority: 1
          fileDropArea:
              label:
                  {
                      de: "Ziehen Sie Dateien per Drag and Drop hierher oder klicken Sie, um Dateien auszuwählen.",
                      en: "Drag and drop some files here, or click to upload.",
                  }
              helperText: { de: "Maximale Uploadgröße: 1,54 MB", en: "Maximum upload size: 1.54MB" }
              targetField: file
              pageAsDropArea: false

          fields:
              - source: file
              - source: updateTime
                type: datetime
                label: letztes Update
              - source: title
                filter: true
              - source: description
                filter: true

    # Wird ein "subNavigation" Index für "image-/file-/videoSelect" definiert,
    # wird die entsprechende Navigation aus folgender Liste angesprochen.
    # "0" ist dabei der Index für das erste Element dieser Liste.
    subNavigation:
        - # Der "name" der Navigation ist für die Mediathek nicht von Bedeutung,
          # kann aber für "eval"-Code interessant sein.
          name: modal

          # Auf "label" wurde hier verzichtet, damit dieses Element nicht in der
          # Hauptnavigation des tibi-admin auftaucht.

          # Folgende Ansicht wird für unsere Auswahl der Datei im ContentBuilder
          # angeboten.
          views:
              - type: cards
                mediaQuery: "(min-width: 0px)"
                fields:
                    - source: file
                    - source: updateTime
                      type: datetime
                      label: letztes Update
                    - source: title
                      filter: true
                    - source: description
                      filter: true

          # Damit der ContentBuilder weiß, welche Datei ausgewählt wurde, ist
          # ist folgender "defaultCallback" notwendig.
          # Die Funktion wird beim Klick auf die entsprechende Datei aufgerufen.
          # Als Funktionsparameter steht der gesamte Datensatz der Auswahl zur
          # Verfügung.
          # Die Funktionen "parent.selectAsset" und "parent.focus" sind ContentBuilder
          # spezifisch und schließen die Listenansicht direkt nach Übergabe der
          # Datei-URL.
          # Die URL setzt sich aus dem Pfad zur Datei und dem Filter "l" zusammen.
          # Es wurde eine relative URL konstruiert, da das ContentBuilder-Widget
          # mit "baseHref" zur Projekt-URL erstellt wird.
          defaultCallback:
              eval: |
                  //js
                  (entry) => {
                      parent.selectAsset("medialib/" + entry.id + "/" + entry.file?.src + "?filter=l")
                      parent.focus()
                  }
                  //!js

        - name: modalForeign # Name des Eingabefelds oder der Ansicht.
          defaultSort: # Standard-Sortierkriterien, die angewendet werden, wenn keine anderen Sortierkriterien spezifiziert sind.
              field: "path" # Standardmäßig wird nach dem "path"-Feld sortiert.
              order: "ASC" # Standardmäßig wird in aufsteigender Reihenfolge (ASC) sortiert.
          views: # Liste der Ansichten, die in diesem Feld angezeigt werden können.
              - type: table # Es wird eine Tabellenansicht verwendet.
                columns: # Liste der Spalten, die in der Tabelle angezeigt werden.
                    - path # Es wird nur die Spalte "path" angezeigt.
          defaultCallback: # Standard-Callback-Funktion, die ausgeführt wird, wenn keine andere spezifiziert ist.
              eval: | # Der Code wird als JavaScript evaluiert.
                  //js
                  (entry) => {  // Diese Funktion nimmt den Eintrag (entry) als Argument.
                      parent.selectEntry(entry)  // Die Funktion selectEntry auf dem übergeordneten Objekt wird mit dem Eintrag als Argument aufgerufen.
                  }
                  //!js

permissions:
    public:
        methods:
            get: true
            post: false
            put: false
            delete: false
    user:
        methods:
            get: true
            post: true
            put: true
            delete: true

projections:
    dashboard:
        select:
hooks:
    delete:
        return:
            type: javascript
            file: hooks/medialib/delete_return.js

fields:
    # Ein Feld vom Typ "file" wird für die Mediathek natürlich
    # benötigt.
    - name: file
      type: file
      meta:
          label:
              de: Datei
              en: File
    - name: title
      type: string
      meta:
          label:
              de: Titel
              en: Title
    - name: description
      type: string
      meta:
          widget: richtext
          label:
              de: Kurzbeschreibung
              en: Short Description

    - name: sort
      type: number

      meta:
          label:
              de: Manuelle Sortierung
              en: Manual Sorting
          inputProps:
              { readonly: true, placeholder: { de: "Wert wird automatisch gesetzt", en: "Value is set automatically" } }
          helperText:
              de: Dieses Feld wird für die manuelle Sortierung benötigt. Sobald ein Eintrag per Drag&Drop verschoben wurde, wird die neue Position innerhalb der Liste eingetragen.
              en: This field is required for manual sorting. As soon as an entry is moved using Drag&Drop, the new position is entered in the list.