mail

.env

@@ -1,8 +1,7 @@
 PROJECT_NAME=fontis
 TIBI_PREFIX=tibi
-TIBI_NAMESPACE=fontis_v2
+TIBI_NAMESPACE=fontis
 UID=100
 GID=101
 RELEASE_ORG_SLUG=webmakers-gmbh
 RELEASE_PROJECT_SLUG=fontis
-START_SCRIPT=:ssr

.gitea/workflows/deploy.yaml

@@ -58,11 +58,11 @@ jobs:
               run: |
                   yarn build
 
-            - name: build ssr
+            #- name: build ssr
-              env:
+            #  env:
-                  FORCE_COLOR: "true"
+            #      FORCE_COLOR: "true"
-              run: |
+            #  run: |
-                  yarn build:server
+            #      yarn build:server
 
             - name: build legacy
               env:
@@ -85,9 +85,9 @@ jobs:
             #      docker compose -p ${GITHUB_REF_NAME}-${GITHUB_REPOSITORY_NAME}-${GITHUB_REPOSITORY_OWNER} up -d --build --remove-orphans
 
             - name: deploy
-              if: github.ref == 'refs/heads/tibi-restructure'
+              if: github.ref == 'refs/heads/master'
               env:
-                  RSYNC_USER: "fontis_rsync_restructure"
+                  RSYNC_USER: "fontis_rsync_master"
-                  RSYNC_PASS: ${{ secrets.RSYNC_RESTRUCTURE }}
+                  RSYNC_PASS: ${{ secrets.rsync_master }}
               run: |
                   scripts/deploy.sh ftp1.webmakers.de $RSYNC_USER $RSYNC_PASS

api/collections/backups.yml

@@ -29,13 +29,6 @@ hooks:
         create:
             type: javascript
             file: hooks/backups/post_create.js
-        return:
-            type: javascript
-            file: hooks/clear_cache.js
-    put:
-        return:
-            type: javascript
-            file: hooks/clear_cache.js
 
 fields:
     - name: collectionName

api/collections/content.yml

@@ -3,162 +3,32 @@ uploadPath: ../media/page
 
 meta:
     label: Inhalt
-    muiIcon: tableOfContents
+    muiIcon: web
-    allowExportAll: true
     backup:
         active: true
         collectionName: backups
-    defaultSort:
-        field: sort
-        order: MANUALLY
     views:
-        - type: simpleList
-          selectionPriority: 0
-          primaryText: pageTitle
-          secondaryText: path
-          mediaQuery: "(min-width: 0px)"
-          tertiaryText: type
         - type: table
-          selectionPriority: 1
-          mediaQuery: "(min-width: 700px)"
           columns:
-              - source: type
-                name: Typ
-                filter: true
               - source: path
-                name: Pfad
-                filter: true
-              - source: pageTitle
-                name: Titel
-                filter: true
-              - source: active
-                name: Aktiv
-                filter: true
-
     tablist:
-        activeTab: general
+        activeTab: site
-
         tabs:
             - name: general
               label: Allgemein
               subFields:
                   - source: path
-                  - source: pageTitle
-                  - source: type
-                  - source: active
-                  - source: sort
 
             - name: teaser
-              label: Homepage Seitenteaser
+              label: Teaser
               subFields:
                   - source: teaser
 
-            - name: personPreview
-              label: Personenvorschau
-              subFields:
-                  - source: personType
-                  - source: personPreview
-
-            - name: jobOffer
-              label: Job Angebot
-              subFields:
-                  - source: jobOffer
-
             - name: site
               label: Seite
               subFields:
                   - source: rows
 
-            - name: meta
-              label: Meta
-              subFields:
-                  - source: meta
-
-    subNavigation:
-        - name: seite
-          label:
-              de: Seiten
-              en: pages
-          muiIcon: book-open-page-variant
-          defaultSort:
-              field: "sort"
-              order: "MANUALLY"
-          setDefault:
-              field: type
-              value: page
-
-          views:
-              - type: table
-                columns:
-                    - source: path
-                      name: Pfad
-                      filter: true
-                    - source: pageTitle
-                      name: Titel
-                      filter: true
-                    - source: active
-                      name: Aktiv
-                      filter: true
-
-          filter:
-              type: page
-
-        - name: teamMembers
-          label:
-              de: Teammitglieder
-              en: Team members
-          muiIcon: accountGroup
-          setDefault:
-              field: type
-              value: teamMembers
-          defaultSort:
-              field: "sort"
-              order: "MANUALLY"
-          views:
-              - type: table
-                columns:
-                    - source: path
-                      name: Pfad
-                      fiter: true
-                    - source: personType
-                      name: Typ
-                      filter: true
-                    - source: pageTitle
-                      name: Titel
-                      filter: true
-                    - source: active
-                      name: Aktiv
-                      filter: true
-          filter:
-              type: teamMembers
-
-        - name: jobOffers
-          label:
-              de: Stellenanzeigen
-              en: Job offers
-          muiIcon: briefcase
-          setDefault:
-              field: type
-              value: jobOffers
-          defaultSort:
-              field: "sort"
-              order: "MANUALLY"
-          views:
-              - type: table
-                columns:
-                    - source: path
-                      name: Pfad
-                      filter: true
-                    - source: pageTitle
-                      name: Titel
-                      filter: true
-                    - source: active
-                      name: Aktiv
-                      filter: true
-
-          filter:
-              type: jobOffers
-
 imageFilter:
     xs:
         - fit: true
@@ -205,16 +75,6 @@ permissions:
             put: true
             delete: true
 
-hooks:
-    post:
-        return:
-            type: javascript
-            file: hooks/clear_cache.js
-    put:
-        return:
-            type: javascript
-            file: hooks/clear_cache.js
-
 projections:
     navigation:
         select:
@@ -226,221 +86,15 @@ fields:
       meta:
           label: Pfad
           helperText: "Ein Pfad sollte mit einem / starten und ohne eins enden."
-          containerProps:
-              layout:
-                  size:
-                      default: "col-6"
-                      small: "col-12"
-                      large: "col-6"
-
-    - type: boolean
-      name: active
-      meta:
-          label: Aktiv
-          helperText: Ist dies Aktiviert, so wird die Seite verfügbar.
-          defaultValue: true
-          containerProps:
-              layout:
-                  size:
-                      default: "col-6"
-                      small: "col-12"
-                      large: "col-6"
-
-    - type: string
-      name: type
-      meta:
-          label: Inhaltstyp
-          widget: select
-          defaultValue: page
-          containerProps:
-              layout:
-                  size:
-                      default: "col-6"
-                      small: "col-12"
-                      large: "col-6"
-          choices:
-              - name: Seite
-                id: page
-
-              - name: Teammitglieder
-                id: teamMembers
-
-              - name: Stellenanzeigen
-                id: jobOffers
-
-    - name: pageTitle
-      type: string
-      meta:
-          label: Titel der Seite
-          helperText: "Dieser Titel wird in der Seite als h1 angezeigt."
-          containerProps:
-              layout:
-                  size:
-                      default: "col-6"
-                      small: "col-12"
-                      large: "col-6"
-
-    - name: personType
-      type: string
-      meta:
-          label: Typ
-          widget: select
-          defaultValue: chef
-          dependsOn:
-              eval: $.type == "teamMembers"
-
-          choices:
-              - name: Chef
-                id: chef
-
-              - name: Mitarbeiter
-                id: employee
-
-    - name: personPreview
-      type: object
-      meta:
-          label: Personenvorschau
-          dependsOn:
-              eval: $.type == "teamMembers"
-      subFields:
-          - name: initialImage
-            type: string
-            meta:
-                label: Bild
-                containerProps:
-                    layout:
-                        size:
-                            default: "col-6"
-                            small: "col-12"
-                            large: "col-6"
-                dependsOn:
-                    eval: $.personType == 'chef'
-                widget: foreignKey # Verwendetes Widget.
-                foreign:
-                    collection: medialib # Name der Sammlung, in der die ausgewählten Daten gespeichert sind.
-                    id: id # Feldname, das als eindeutige Kennung für die ausgewählten Daten verwendet wird.
-                    subNavigation: 0 # Bestimmt, welche Navigation für die Auswahl der ausgewählten Daten angezeigt wird.
-                    #projection: xyz
-                    #sort: "title"
-                    render:
-                        defaultCollectionViews: true
-
-          - name: hoverImage
-            type: string
-            meta:
-                label: Bild beim Hover
-                containerProps:
-                    layout:
-                        size:
-                            default: "col-6"
-                            small: "col-12"
-                            large: "col-6"
-                dependsOn:
-                    eval: $.personType == 'chef'
-                widget: foreignKey # Verwendetes Widget.
-                foreign:
-                    collection: medialib # Name der Sammlung, in der die ausgewählten Daten gespeichert sind.
-                    id: id # Feldname, das als eindeutige Kennung für die ausgewählten Daten verwendet wird.
-                    subNavigation: 0 # Bestimmt, welche Navigation für die Auswahl der ausgewählten Daten angezeigt wird.
-                    #projection: xyz
-                    #sort: "title"
-                    render:
-                        defaultCollectionViews: true
-
-          - name: name
-            type: string
-            meta:
-                label: Name
 
     - !include fields/teaserHomepage.yml
 
-    - name: jobOffer
-      type: object
-      meta:
-          label: Job Angebot
-          dependsOn:
-              eval: $.type == "jobOffers"
-      subFields:
-          - name: title
-            type: string
-            meta:
-                label: Titel
-
-          - name: text
-            type: string
-            meta:
-                widget: richtext
-                label: Text
-
-          - name: emailButton
-            type: boolean
-            meta:
-                label: E-Mail Button Anzeigen
-
-          - name: emailSubject
-            type: string
-            meta:
-                label: E-Mail Betreff
-                dependsOn:
-                    eval: $parent.emailButton == true
-
     - name: rows
       type: object[]
       meta:
           label: Zeilen
-          widget: grid
+          widget: containerLessObjectArray
-          dependsOn:
+          folding:
-              eval: $.type != "jobOffers" && ($.type != "teamMembers" || $.personType == "chef")
+              force: true
-          metaElements:
-              - source: backgroundImage
-              - source: noBottomMargin
-              - source: noTopMargin
-              - source: flexWrapNormal
-              - source: twoToThree
-              - source: nextPage
-
-      subFields: !include fieldLists/row.yml
-
-    - name: meta
-      type: object
-      meta:
-          label: Meta Agaben
-          dependsOn:
-              eval: $.type == "page"
       subFields:
-          - name: title
+          - !include fields/row.yml
-            type: string
-            meta:
-                label: Titel
-                containerProps:
-                    layout:
-                        size:
-                            default: "col-6"
-                            small: "col-12"
-                            large: "col-6"
-
-          - name: description
-            type: string
-            meta:
-                label: Beschreibung
-                containerProps:
-                    layout:
-                        size:
-                            default: "col-6"
-                            small: "col-12"
-                            large: "col-6"
-          - name: keywords
-            type: string
-            meta:
-                label: Schlüsselwörter
-    - 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.

api/collections/fieldLists/box.yml

@@ -1,32 +1,11 @@
 - name: icon
-  type: string
+  type: file
   meta:
       label: Icon
       helperText: "Das Icon wird in der Box angezeigt."
-      widget: foreignKey # Verwendetes Widget.
+      
-      foreign:
-          collection: medialib # Name der Sammlung, in der die ausgewählten Daten gespeichert sind.
-          id: id # Feldname, das als eindeutige Kennung für die ausgewählten Daten verwendet wird.
-          subNavigation: 0 # Bestimmt, welche Navigation für die Auswahl der ausgewählten Daten angezeigt wird.
-          #projection: xyz
-          #sort: "title"
-          render:
-              defaultCollectionViews: true
-      containerProps:
-          layout:
-              size:
-                  default: "col-6"
-                  small: "col-12"
-                  large: "col-6"
-
 - name: text
   type: string
   meta:
       label: Text
       helperText: "Der Text wird in der Box angezeigt."
-      containerProps:
-          layout:
-              size:
-                  default: "col-6"
-                  small: "col-12"
-                  large: "col-6"

api/collections/fieldLists/cards.yml

@@ -1,15 +1,8 @@
 - name: image
-  type: string
+  type: file
   meta:
       label: Kartenausschnitt
       helperText: "Der Kartenausschnitt wird als Hintergrundbild angezeigt."
-      widget: foreignKey # Verwendetes Widget.
-      foreign:
-          collection: medialib # Name der Sammlung, in der die ausgewählten Daten gespeichert sind.
-          id: id # Feldname, das als eindeutige Kennung für die ausgewählten Daten verwendet wird.
-          subNavigation: 0 # Bestimmt, welche Navigation für die Auswahl der ausgewählten Daten angezeigt wird.
-          render:
-              defaultCollectionViews: true
 
 - name: title
   type: string

api/collections/fieldLists/column.yml

@@ -7,8 +7,11 @@
           - name: Bild
             id: image
 
-          - name: Modul Import
+          - name: Icons im Rechteck
-            id: moduleImport
+            id: iconCycleSquare
+
+          - name: Icons im Kreis
+            id: iconCycleCircle
 
           - name: Text
             id: text
@@ -16,18 +19,33 @@
           - name: Informationsbrett
             id: infoBoard
 
+          - name: Weltkarte
+            id: worldCard
+
           - name: Verschatelte Karte
             id: nestedCard
 
           - name: Top-Down
             id: topDown
 
+          - name: Personenvorschau
+            id: personPreview
+
+          - name: Boxliste
+            id: boxlist
+
+          - name: Ausfahrbare Box
+            id: extendableBoxes
+
           - name: Text mit Link
             id: textLink
 
           - name: Icon block
             id: iconBlocks
 
+          - name: Seitenlinks
+            id: pageLinkBlocks
+
           - name: Netzwerk Veranstaltungen
             id: networkEvents
 
@@ -40,30 +58,16 @@
       label: Netzwerkveranstaltungen
       dependsOn:
           eval: $parent.contentType == 'networkEvents'
-      widget: containerLessObjectArray
-
   subFields:
       - name: beginDate
         type: date
         meta:
             label: Beginn
-            containerProps:
-                layout:
-                    size:
-                        default: "col-6"
-                        small: "col-6"
-                        large: "col-6"
 
       - name: endDate
         type: date
         meta:
             label: Ende
-            containerProps:
-                layout:
-                    size:
-                        default: "col-6"
-                        small: "col-6"
-                        large: "col-6"
 
       - name: title
         type: string
@@ -71,18 +75,9 @@
             label: Titel
 
       - name: file
-        type: string
+        type: file
         meta:
             label: downloadDatei
-            widget: foreignKey # Verwendetes Widget.
-            foreign:
-                collection: medialib # Name der Sammlung, in der die ausgewählten Daten gespeichert sind.
-                id: id # Feldname, das als eindeutige Kennung für die ausgewählten Daten verwendet wird.
-                subNavigation: 0 # Bestimmt, welche Navigation für die Auswahl der ausgewählten Daten angezeigt wird.
-                #projection: xyz
-                #sort: "title"
-                render:
-                    defaultCollectionViews: true
 
 - name: publications
   type: object[]
@@ -90,8 +85,6 @@
       label: Publikationen
       dependsOn:
           eval: $parent.contentType == 'publications'
-      widget: containerLessObjectArray
-      direction: row
   subFields:
       - name: content
         type: string
@@ -100,18 +93,9 @@
             widget: richtext
 
       - name: file
-        type: string
+        type: file
         meta:
             label: downloadDatei
-            widget: foreignKey # Verwendetes Widget.
-            foreign:
-                collection: medialib # Name der Sammlung, in der die ausgewählten Daten gespeichert sind.
-                id: id # Feldname, das als eindeutige Kennung für die ausgewählten Daten verwendet wird.
-                subNavigation: 0 # Bestimmt, welche Navigation für die Auswahl der ausgewählten Daten angezeigt wird.
-                #projection: xyz
-                #sort: "title"
-                render:
-                    defaultCollectionViews: true
 
 - name: iconBlocks
   type: object[]
@@ -119,102 +103,96 @@
       label: Icon block
       dependsOn:
           eval: $parent.contentType == 'iconBlocks'
-      widget: containerLessObjectArray
-      direction: row
   subFields:
       - name: icon
-        type: string
+        type: file
         meta:
             label: Icon
-            widget: foreignKey # Verwendetes Widget.
-            foreign:
-                collection: medialib # Name der Sammlung, in der die ausgewählten Daten gespeichert sind.
-                id: id # Feldname, das als eindeutige Kennung für die ausgewählten Daten verwendet wird.
-                subNavigation: 0 # Bestimmt, welche Navigation für die Auswahl der ausgewählten Daten angezeigt wird.
-                #projection: xyz
-                #sort: "title"
-                render:
-                    defaultCollectionViews: true
       - name: bigText
         type: string
         meta:
             label: oberer text
-            containerProps:
-                layout:
-                    size:
-                        default: "col-6"
-                        small: "col-12"
-                        large: "col-6"
-
       - name: smallText
         type: string
         meta:
             label: unterer Text
-            containerProps:
+
-                layout:
+- name: pageLinkBlocks
-                    size:
+  type: object[]
-                        default: "col-6"
+  meta:
-                        small: "col-12"
+      label: Seitenlinks
-                        large: "col-6"
+      dependsOn:
+          eval: $parent.contentType == 'pageLinkBlocks'
+  subFields:
+      - name: page
+        type: string
+        meta:
+            label: Seite
+            widget: select
+            choices:
+                endpoint: page
+                params:
+                    sort: path
+                    projection: navigation
+                mapping:
+                    id: id
+                    name: path
+
+      - name: name
+        type: string
+        meta:
+            label: Name
+
+      - name: rowNr
+        type: number
+        meta:
+            label: Zeilen Nr (0 Basiert)
+
+      - name: extendableRowNr
+        type: number
+        meta:
+            label: Ausfahrbare boxreihe (0 Basiert)
 
 - name: image
-  type: string
+  type: file
   meta:
       label: Bild
       dependsOn:
           eval: $parent.contentType == 'image'
-      widget: foreignKey # Verwendetes Widget.
-      foreign:
-          collection: medialib # Name der Sammlung, in der die ausgewählten Daten gespeichert sind.
-          id: id # Feldname, das als eindeutige Kennung für die ausgewählten Daten verwendet wird.
-          subNavigation: 0 # Bestimmt, welche Navigation für die Auswahl der ausgewählten Daten angezeigt wird.
-          #projection: xyz
-          #sort: "title"
-          render:
-              defaultCollectionViews: true
 
 - name: icons
   type: object[]
   meta:
       label: Icons
       helperText: "Für Personpreview xing und linkedin icons gedacht."
-      widget: containerLessObjectArray
-      direction: row
       dependsOn:
           eval: $parent.contentType == 'image'
   subFields:
       - name: icon
-        type: string
+        type: file
         meta:
             label: Icon
-            widget: foreignKey # Verwendetes Widget.
-            foreign:
-                collection: medialib # Name der Sammlung, in der die ausgewählten Daten gespeichert sind.
-                id: id # Feldname, das als eindeutige Kennung für die ausgewählten Daten verwendet wird.
-                subNavigation: 0 # Bestimmt, welche Navigation für die Auswahl der ausgewählten Daten angezeigt wird.
-                #projection: xyz
-                #sort: "title"
-                render:
-                    defaultCollectionViews: true
 
       - name: link
         type: string
         meta:
             label: Link
 
-- name: moduleImport
+- name: iconCycleSquare
-  type: string
+  type: object
   meta:
-      label: Modul Import
+      label: Icons im Rechteck
       dependsOn:
-          eval: $parent.contentType == 'moduleImport'
+          eval: $parent.contentType == 'iconCycleSquare'
-      widget: foreignKey
+  subFields: !include iconCycleSquare.yml
-      foreign:
+
-          collection: module
+- name: iconCycleCircle
-          id: id
+  type: object
-          subNavigation: 0
+  meta:
-          render:
+      label: Icons im Kreis
-              defaultCollectionViews: true
+      dependsOn:
+          eval: $parent.contentType == 'iconCycleCircle'
+  subFields: !include iconCycleCircle.yml
 
 - name: text
   type: string
@@ -228,7 +206,6 @@
   type: object
   meta:
       label: Informationsbrett
-      widget: containerLessObject
       dependsOn:
           eval: $parent.contentType == 'infoBoard'
   subFields:
@@ -246,26 +223,36 @@
             helperText: "Dieser Text wird im Infobrett angezeigt."
 
       - name: icon
-        type: string
+        type: file
         meta:
             label: Icon
             helperText: "Das Icon wird im Infobrett angezeigt."
-            widget: foreignKey # Verwendetes Widget.
+
-            foreign:
+- name: worldCard
-                collection: medialib # Name der Sammlung, in der die ausgewählten Daten gespeichert sind.
+  type: object
-                id: id # Feldname, das als eindeutige Kennung für die ausgewählten Daten verwendet wird.
+  meta:
-                subNavigation: 0 # Bestimmt, welche Navigation für die Auswahl der ausgewählten Daten angezeigt wird.
+      label: Weltkarte
-                #projection: xyz
+      dependsOn:
-                #sort: "title"
+          eval: $parent.contentType == 'worldCard'
-                render:
+  subFields:
-                    defaultCollectionViews: true
+      - name: row
+        type: object[]
+        meta:
+            label: Zeilen
+        subFields:
+            - name: cards
+              type: object[]
+              meta:
+                  label: Karten
+                  metaElements:
+                      - verticalAlignment
+                      - horizontalAlignment
+              subFields: !include cards.yml
 
 - name: nestedCard
   type: object[]
   meta:
       label: Verschatelte Karte
-      widget: containerLessObjectArray
-      direction: row
       dependsOn:
           eval: $parent.contentType == 'nestedCard'
   subFields:
@@ -285,7 +272,6 @@
   type: object
   meta:
       label: Top-Down
-      widget: containerLessObject
       dependsOn:
           eval: $parent.contentType == 'topDown'
   subFields:
@@ -293,40 +279,110 @@
         type: object[]
         meta:
             label: Zeilen
-            widget: containerLessObjectArray
         subFields:
             - name: inital
               type: string
               meta:
                   label: Großbuchstabe
-                  containerProps:
-                      layout:
-                          size:
-                              default: "col-6"
-                              small: "col-12"
-                              large: "col-6"
 
             - name: rest
               type: string
               meta:
                   label: Rest
-                  containerProps:
-                      layout:
-                          size:
-                              default: "col-6"
-                              small: "col-12"
-                              large: "col-6"
 
             - name: description
               type: string
               meta:
                   label: Beschreibung
+- name: personPreview
+  type: object[]
+  meta:
+      label: Personenvorschau
+      dependsOn:
+          eval: $parent.contentType == 'personPreview'
+      metaElements:
+          - initialImage
+          - hoverImage
+  subFields:
+      - name: initialImage
+        type: file
+        meta:
+            label: Bild
+      - name: hoverImage
+        type: file
+        meta:
+            label: Bild beim Hover
+      - name: name
+        type: string
+        meta:
+            label: Name
+
+      - name: link
+        type: string
+        meta:
+            label:
+                de: Seite
+                en: page
+            widget: select
+            choices:
+                endpoint: page
+                params:
+                    sort: path
+                    projection: navigation
+                mapping:
+                    id: id
+                    name: path
+
+- name: boxList
+  type: object
+  meta:
+      label: Boxenliste
+      dependsOn:
+          eval: $parent.contentType == 'boxlist'
+  subFields:
+      - name: boxes
+        type: object[]
+        meta:
+            label: Boxen
+        subFields:
+            - name: name
+              type: string
+              meta:
+                  label: Name
+
+- name: extendableBoxes
+  type: object[]
+  meta:
+      label: Ausklappbare Box
+      dependsOn:
+          eval: $parent.contentType == 'extendableBoxes'
+  subFields:
+      - name: title
+        type: string
+        meta:
+            label: Titel
+
+      - name: text
+        type: string
+        meta:
+            widget: richtext
+            label: Text
+      - name: emailButton
+        type: boolean
+        meta:
+            label: E-Mail Button Anzeigen
+
+      - name: emailSubject
+        type: string
+        meta:
+            label: E-Mail default Betreff
+            dependsOn:
+                eval: $parent.emailButton == true
 
 - name: textLink
   type: object
   meta:
       label: Text Link
-      widget: containerLessObject
       dependsOn:
           eval: $parent.contentType == 'textLink'
   subFields:
@@ -349,5 +405,5 @@
                     sort: path
                     projection: navigation
                 mapping:
-                    id: id
+                    id: id 
                     name: path

api/collections/fieldLists/iconCycleCircle.yml

@@ -2,9 +2,6 @@
   type: object[]
   meta:
       label: Boxen
-      pathStep:
-          title: "icons im Kreis"
-      widget: containerLessObjectArray
   subFields: !include box.yml
 
 - name: innerText

api/collections/fieldLists/iconCycleSquare.yml

@@ -2,7 +2,4 @@
   type: object[]
   meta:
       label: Boxen
-      pathStep:
-          title: "icons im Rechteck"
-      widget: containerLessObjectArray
   subFields: !include box.yml

api/collections/fieldLists/medialibViews.yml

@@ -1,47 +0,0 @@
-- type: table
-  mediaQuery: "(min-width: 0px)"
-  defaultSelect: false
-  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: false
-  columns:
-      - source: file
-        name: Datei
-        filter: true
-      - source: title
-        name: Titel
-        filter: true
-      - source: alt
-        name: Alternativtext
-        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
-        name: Datei
-        filter: true
-      - source: title
-        name: Titel
-        filter: true
-      - source: alt
-        name: Alternativtext
-        filter: true

api/collections/fieldLists/row.yml

@@ -1,118 +0,0 @@
-- name: topTitle
-  type: string
-  meta:
-      label: Oberer Titel
-      helperText: "Dieser Titel wird in der Zeile oben angezeigt."
-      containerProps:
-          layout:
-              size:
-                  default: "col-6"
-                  small: "col-12"
-                  large: "col-6"
-
-- name: topTitleUpperCase
-  type: boolean
-  meta:
-      label: Oberer Titel in Großbuchstaben
-      helperText: "Ist dies aktiviert, so wird der obere Titel in Großbuchstaben angezeigt."
-      containerProps:
-          layout:
-              size:
-                  default: "col-6"
-                  small: "col-6"
-                  large: "col-6"
-
-- name: title
-  type: string
-  meta:
-      label: Titel
-      helperText: "Dieser Titel wird in der Zeile angezeigt."
-      containerProps:
-          layout:
-              size:
-                  default: "col-6"
-                  small: "col-6"
-                  large: "col-6"
-
-- name: subTitle
-  type: string
-  meta:
-      label: Untertitel
-      helperText: "Dieser Untertitel wird in der Zeile angezeigt."
-      containerProps:
-          layout:
-              size:
-                  default: "col-6"
-                  small: "col-6"
-                  large: "col-6"
-
-- name: backgroundImage
-  type: string
-  meta:
-      label: Hintergrundbild
-      helperText: "Dieses Bild wird als Hintergrundbild der Zeile angezeigt."
-      widget: foreignKey # Verwendetes Widget.
-      foreign:
-          collection: medialib # Name der Sammlung, in der die ausgewählten Daten gespeichert sind.
-          id: id # Feldname, das als eindeutige Kennung für die ausgewählten Daten verwendet wird.
-          subNavigation: 0 # Bestimmt, welche Navigation für die Auswahl der ausgewählten Daten angezeigt wird.
-          #projection: xyz
-          #sort: "title"
-          render:
-              defaultCollectionViews: true
-
-- name: noBottomMargin
-  type: boolean
-  meta:
-      label: Kein unterer Abstand
-      helperText: "Ist dies aktiviert, so wird kein Abstand unter der Zeile angezeigt."
-      containerProps:
-          layout:
-              size:
-                  default: "col-4"
-                  small: "col-6"
-                  large: "col-4"
-
-- name: noTopMargin
-  type: boolean
-  meta:
-      label: Kein oberer Abstand
-      helperText: "Ist dies aktiviert, so wird kein Abstand über der Zeile angezeigt."
-      containerProps:
-          layout:
-              size:
-                  default: "col-4"
-                  small: "col-6"
-                  large: "col-4"
-
-- name: flexWrapNormal
-  type: boolean
-  meta:
-      label: Zeile normal umbrechen
-      helperText: "Ist dies aktiviert, so wird die Zeile normal und nicht reverse umgebrochen."
-      containerProps:
-          layout:
-              size:
-                  default: "col-4"
-                  small: "col-6"
-                  large: "col-4"
-
-- name: twoToThree
-  type: boolean
-  meta:
-      label: Zwei zu drei
-      helperText: "Ist dies aktiviert, so wird die Zeile in zwei zu drei Spalten aufgeteilt."
-      containerProps:
-          layout:
-              size:
-                  default: "col-4"
-                  small: "col-6"
-                  large: "col-4"
-
-- name: columns
-  type: object[]
-  meta:
-      label: Spalten
-      direction: row
-      widget: grid
-  subFields: !include ../fieldLists/column.yml

api/collections/fields/row.yml

@@ -0,0 +1,90 @@
+name: row
+type: object
+meta:
+    label: Zeile
+    metaElements:
+        - topTitle
+        - topTitleRed
+        - title
+        - subTitle
+        - pageTitle
+subFields:
+    - name: topTitle
+      type: string
+      meta:
+          label: Oberer Titel
+          helperText: "Dieser Titel wird in der Zeile oben angezeigt."
+
+    - name: topTitleUpperCase
+      type: boolean
+      meta:
+          label: Oberer Titel in Großbuchstaben
+          helperText: "Ist dies aktiviert, so wird der obere Titel in Großbuchstaben angezeigt."
+
+    - name: title
+      type: string
+      meta:
+          label: Titel
+          helperText: "Dieser Titel wird in der Zeile angezeigt."
+
+    - name: subTitle
+      type: string
+      meta:
+          label: Untertitel
+          helperText: "Dieser Untertitel wird in der Zeile angezeigt."
+
+    - name: pageTitle
+      type: string
+      meta:
+          label: Titel der Seite
+          helperText: "Dieser Titel wird in der Seite als h1 angezeigt."
+
+    - name: backgroundImage
+      type: file
+      meta:
+          label: Hintergrundbild
+          helperText: "Dieses Bild wird als Hintergrundbild der Zeile angezeigt."
+
+    - name: noBottomMargin
+      type: boolean
+      meta:
+          label: Kein unterer Abstand
+          helperText: "Ist dies aktiviert, so wird kein Abstand unter der Zeile angezeigt."
+    - name: noTopMargin
+      type: boolean
+      meta:
+          label: Kein oberer Abstand
+          helperText: "Ist dies aktiviert, so wird kein Abstand über der Zeile angezeigt."
+
+    - name: flexWrapNormal
+      type: boolean
+      meta:
+          label: Zeile normal umbrechen
+          helperText: "Ist dies aktiviert, so wird die Zeile normal und nicht reverse umgebrochen."
+
+    - name: twoToThree
+      type: boolean
+      meta:
+          label: Zwei zu drei
+          helperText: "Ist dies aktiviert, so wird die Zeile in zwei zu drei Spalten aufgeteilt."
+
+    - name: nextPage
+      type: string
+      meta:
+          label: Nächste Seite
+          widget: select
+          choices:
+              endpoint: page
+              params:
+                  sort: path
+                  projection: navigation
+              mapping:
+                  id: path
+                  name: path
+
+    - name: columns
+      type: object[]
+      meta:
+          label: Spalten
+          direction: row
+      subFields: !include ../fieldLists/column.yml

api/collections/fields/teaserHomepage.yml

@@ -2,8 +2,8 @@ name: teaser
 type: object
 meta:
     label: Teaser
-    dependsOn:
+    metaElements:
-        eval: $.type == "page"
+        - showTeaser
 subFields:
     - name: showTeaser
       type: boolean
@@ -14,8 +14,8 @@ subFields:
     - name: subTitle
       type: string
       meta:
-          label: Übertitel
+          label: Untertitel
-          helperText: "Dieser Übertitel wird in der Startseite über dem Titel angezeigt."
+          helperText: "Dieser Untertitel wird in der Startseite angezeigt."
 
     - name: teaserTitle
       type: string
@@ -28,4 +28,4 @@ subFields:
       meta:
           widget: richtext
           label: Beschreibung
-          helperText: "Diese Beschreibung wird in der Startseite unter dem Titel angezeigt."
+          helperText: "Diese Beschreibung wird in der Startseite angezeigt."

api/collections/lighthouse-subpaths.yml

@@ -1,29 +0,0 @@
-name: lighthouseSubpath
-
-meta:
-    label: Lighthouse Subpaths
-    muiIcon: web
-    views:
-        - type: table
-          columns:
-              - source: lighthouseSubpath
-
-permissions:
-    public:
-        methods:
-            get: false
-            post: false
-            put: false
-            delete: false
-    user:
-        methods:
-            get: true
-            post: true
-            put: true
-            delete: true
-
-fields:
-    - type: string
-      name: lighthouseSubpath
-      meta:
-          label: PagespeedPaths

api/collections/lighthouse.yml

@@ -1,120 +0,0 @@
-name: lighthouse
-
-meta:
-    label: Lighthouse
-    muiIcon: web
-    views:
-        - type: table
-          mediaQuery: "(min-width: 600px)"
-          columns:
-              - source: insertTime
-                filter: true
-              - source: perfomance
-                filter: true
-              - source: accessibility
-                filter: true
-              - source: bestPractices
-                filter: true
-              - source: seo
-                filter: true
-        - type: simpleList
-          mediaQuery: "(max-width: 599px)"
-          primaryText: insertTime
-          secondaryText: performance
-          tertiaryText: accessibility
-
-permissions:
-    public:
-        methods:
-            get: false
-            post: false
-            put: false
-            delete: false
-    user:
-        methods:
-            get: true
-            post: true
-            put: true
-            delete: true
-
-projections:
-    dashboard:
-
-hooks:
-    post:
-        create:
-            type: javascript
-            file: hooks/lighthouse/post_create.js
-
-fields:
-    - name: analyzedPaths
-      type: string[]
-      meta:
-          label: Analyzed Paths
-    - name: performance
-      type: number
-      meta:
-          label: Performance
-    - name: accessibility
-      type: number
-      meta:
-          label: Accessibility
-    - name: bestPractices
-      type: number
-      meta:
-          label: Best Practices
-    - name: seo
-      type: number
-      meta:
-          label: SEO
-    - name: lighthouseMetrics
-
-      type: object
-      meta:
-          label: Lighthouse Metrics
-      subFields:
-          - name: FCPS
-            type: number
-            meta:
-                label: First Contentful Paint Score
-          - name: FCPV
-            type: number
-            meta:
-                label: First Contentful Paint Value
-          - name: FMPV
-            type: number
-            meta:
-                label: First Meaningful Paint Value
-
-          - name: FMPS
-            type: number
-            meta:
-                label: First Meaningful Paint Score
-
-          - name: SIS
-            type: number
-            meta:
-                label: Speed Index Score
-
-          - name: SIV
-            type: number
-            meta:
-                label: Speed Index Value
-          - name: TTIS
-            type: number
-            meta:
-                label: Time to Interactive Score
-
-          - name: TTIV
-            type: number
-            meta:
-                label: Time to Interactive Value
-          - name: FPIDS
-            type: number
-            meta:
-                label: First Potential Input Delay Score
-
-          - name: FPIDV
-            type: number
-            meta:
-                label: First Potential Input Delay Value

api/collections/medialib.yml

@@ -1,149 +0,0 @@
-# Der Name der Kollektion ist beliebig, aber wird in unserem
-# Beispiel vom ContentBuilder als "medialib" referenziert.
-name: medialib
-uploadPath: ../media/medialib
-
-meta:
-    allowExportAll: true
-    label:
-        de: Medienbibliothek
-        en: Media Library
-    muiIcon: multimedia
-    defaultSort:
-        field: sort
-        order: MANUALLY
-
-    backup:
-        active: true
-        collectionName: backups
-
-    quickEdit:
-        enabled: true
-        fields:
-            - title
-            - alt
-            - file
-
-    # "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: xs
-
-    multiupload:
-        fields: []
-
-    views: !include fieldLists/medialibViews.yml
-
-    subNavigation:
-        - 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: !include fieldLists/medialibViews.yml
-
-          defaultCallback: # Standard-Callback-Funktion, die ausgeführt wird, wenn keine andere spezifiziert ist.
-              eval: | # Der Code wird als JavaScript evaluiert.
-                  //js
-                  (entry) => {
-                      parent.selectEntry(entry)  
-                  }
-                  //!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:
-    post:
-        return:
-            type: javascript
-            file: hooks/clear_cache.js
-    put:
-        return:
-            type: javascript
-            file: hooks/clear_cache.js
-
-imageFilter:
-    xs:
-        - fit: true
-          height: 90
-          width: 90
-          resampling: lanczos
-          quality: 60
-    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
-    xl:
-        - fit: true
-          height: 2000
-          width: 2000
-          resampling: lanczos
-          quality: 60
-fields:
-    - name: file
-      type: file
-      meta:
-          label:
-              de: Datei
-              en: File
-
-    - name: alt
-      type: string
-      meta:
-          label:
-              de: Alternativtext
-              en: Alternative text
-          helperText:
-              de: Der Alternativtext wird angezeigt, wenn die Datei nicht geladen werden kann.
-              en: The alternative text is displayed if the file cannot be loaded.
-
-    - name: title
-      type: string
-      meta:
-          label:
-              de: Titel
-              en: Title
-          helperText:
-              de: Der Titel wird angezeigt, wenn die Datei geladen wird.
-              en: The title is displayed when the file is loaded.
-
-    - 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.

api/collections/module.yml

@@ -1,172 +0,0 @@
-name: module
-
-meta:
-    label: Module
-    allowExportAll: true
-    backup:
-        active: true
-        collectionName: backups
-
-    views:
-        - type: table
-          columns:
-              - source: type
-                name: Typ
-                filter: true
-
-    subNavigation:
-        - name: modal
-          views:
-              - type: table
-                columns:
-                    - source: type
-          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
-hooks:
-    post:
-        return:
-            type: javascript
-            file: hooks/clear_cache.js
-    put:
-        return:
-            type: javascript
-            file: hooks/clear_cache.js
-
-permissions:
-    public:
-        methods:
-            get: true
-            post: false
-            put: false
-            delete: false
-    user:
-        methods:
-            get: true
-            post: true
-            put: true
-            delete: true
-
-imageFilter:
-    xs:
-        - fit: true
-          height: 90
-          width: 90
-          resampling: lanczos
-          quality: 60
-    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: 1240
-          width: 1240
-          resampling: lanczos
-          quality: 60
-    xl:
-        - fit: true
-          height: 2000
-          width: 2000
-          resampling: lanczos
-          quality: 60
-
-fields:
-    - name: type
-      type: string
-      meta:
-          label: Modultyp
-          helperText: "Wählen Sie den Typ des Moduls aus."
-          widget: select
-          choices:
-              - name: Arbeitskreislauf
-                id: iconCycleCircle
-
-              - name: Icons im Rechteck
-                id: iconCycleSquare
-
-              - name: Weltkarte
-                id: worldCard
-
-              - name: Chef Team
-                id: chefTeam
-
-              - name: Mitarbeiter Team
-                id: employeeTeam
-
-              - name: Stellenanzeigen Verlinkungen
-                id: jobOfferLink
-
-              - name: Stellenanzeigen
-                id: jobOffer
-
-    - name: jobOfferPage
-      type: string
-      meta:
-          label: Stellenanzeigen
-          widget: select
-          dependsOn:
-              eval: $parent.type == 'jobOfferLink'
-          choices:
-              endpoint: page
-              params:
-                  sort: path
-                  projection: navigation
-              mapping:
-                  id: path
-                  name: path
-
-    - name: iconCycleCircle
-      type: object
-      meta:
-          label: Icons im Kreis
-          widget: containerLessObject
-
-          dependsOn:
-              eval: $parent.type == 'iconCycleCircle'
-      subFields: !include fieldLists/iconCycleCircle.yml
-
-    - name: iconCycleSquare
-      type: object
-      meta:
-          label: Icons im Rechteck
-          dependsOn:
-              eval: $parent.type == 'iconCycleSquare'
-      subFields: !include fieldLists/iconCycleSquare.yml
-
-    - name: worldCard
-      type: object
-      meta:
-          label: Weltkarte
-          widget: containerLessObject
-          dependsOn:
-              eval: $parent.type == 'worldCard'
-      subFields:
-          - name: row
-            type: object[]
-            meta:
-                label: Weltkartenreihe
-                widget: grid
-            subFields:
-                - name: cards
-                  type: object[]
-                  meta:
-                      label: Kartenspalten
-                      widget: grid
-                      direction: row
-                      metaElements:
-                          - verticalAlignment
-                          - horizontalAlignment
-                  subFields: !include fieldLists/cards.yml

api/collections/navigation.yml

@@ -4,10 +4,6 @@ uploadPath: ../media/navigation
 meta:
     label: "Navigation"
     muiIcon: navigation
-    allowExportAll: true
-    backup:
-        active: true
-        collectionName: backups
     views:
         - type: simpleList
           mediaQuery: "(max-width:599px)"
@@ -17,7 +13,6 @@ meta:
           mediaQuery: "(min-width:600px)"
           columns:
               - source: tree
-                name: Navigationsbaum
 
 permissions:
     public:
@@ -32,15 +27,8 @@ permissions:
             post: false
             put: true
             delete: false
-hooks:
+
-    post:
+
-        return:
-            type: javascript
-            file: hooks/clear_cache.js
-    put:
-        return:
-            type: javascript
-            file: hooks/clear_cache.js
 
 fields:
     - name: tree
@@ -68,8 +56,6 @@ fields:
           folding:
               previewUnfolded: name
               previewFolded: name
-
-          widget: containerLessObjectArray
       subFields:
           - name: name
             type: string

api/collections/ssr.yml

@@ -7,7 +7,6 @@ meta:
     label: { de: "SSR Dummy", en: "ssr dummy" }
     muiIcon: server
     rowIdentTpl: { twig: "{{ id }}" }
-
     views:
         - type: simpleList
           mediaQuery: "(max-width: 600px)"
@@ -33,6 +32,8 @@ permissions:
             post: false
             put: false
             delete: false
+
+            
     "token:${SSR_TOKEN}":
         methods:
             # only via url=
@@ -56,7 +57,6 @@ fields:
     - name: path
       type: string
       index: [single, unique]
-
     - name: content
       type: string
       meta:

api/config.yml

@@ -1,4 +1,4 @@
-namespace: fontis_v2
+namespace: fontis
 
 meta:
     imageUrl:
@@ -7,248 +7,9 @@ meta:
         servers:
             - url: https://tibi-admin-server.code.testversion.online/api/v1/_/demo
               description: code-server
+
     dashboard:
         majorItems:
-            - type: "sectionTitle"
-              title: { de: "Website Perfomance", en: "Website Perfomance" }
-              appendix:
-                  collection: lighthouse
-                  eval: |
-                      (function(){
-                         return "  " + new Date($date).toLocaleDateString() + ""
-                      })()
-            - type: graph
-              filter: false
-              graphType: radialBar
-              until: "lastYear"
-              value: total
-              containerProps:
-                  #optional class prop
-                  layout:
-                      breakBefore: false
-                      breakAfter: false
-                      size:
-                          default: "col-6"
-                          small: "col-12"
-                          large: "col-3"
-              options:
-                  {
-                      property: plotOptions,
-                      value:
-                          {
-                              radialBar:
-                                  {
-                                      hollow: { margin: 0, size: "70%" },
-                                      track: { dropShadow: { enabled: true, top: 2, left: 0, blur: 4, opacity: 0.15 } },
-                                      dataLabels:
-                                          {
-                                              name: { offsetY: -10, color: "#000", fontSize: "13px" },
-                                              value: { color: "#000", fontSize: "30px", show: true },
-                                          },
-                                  },
-                          },
-                  }
-              graphs:
-                  - collection: lighthouse
-                    field: performance
-                    yAxis: latestValue
-                    graphName: { de: "Perfomance Score", en: "Perfomance Score" }
-                    dateTimeField: insertTime
-
-            - type: graph
-              filter: false
-              graphType: radialBar
-              until: "lastYear"
-              value: total
-              containerProps:
-                  #optional class prop
-                  layout:
-                      breakBefore: false
-                      breakAfter: false
-                      size:
-                          default: "col-6"
-                          small: "col-12"
-                          large: "col-3"
-              options:
-                  {
-                      property: plotOptions,
-                      value:
-                          {
-                              radialBar:
-                                  {
-                                      hollow: { margin: 0, size: "70%" },
-                                      track: { dropShadow: { enabled: true, top: 2, left: 0, blur: 4, opacity: 0.15 } },
-                                      dataLabels:
-                                          {
-                                              name: { offsetY: -10, color: "#000", fontSize: "13px" },
-                                              value: { color: "#000", fontSize: "30px", show: true },
-                                          },
-                                  },
-                          },
-                  }
-              graphs:
-                  - collection: lighthouse
-                    field: accessibility
-                    yAxis: latestValue
-                    graphName: { de: "Accessibility Score", en: "Accessibility Score" }
-                    dateTimeField: insertTime
-
-            - type: graph
-              filter: false
-              graphType: radialBar
-              until: "lastYear"
-              value: total
-              containerProps:
-                  #optional class prop
-                  layout:
-                      breakBefore: false
-                      breakAfter: false
-                      size:
-                          default: "col-6"
-                          small: "col-12"
-                          large: "col-3"
-              options:
-                  {
-                      property: plotOptions,
-                      value:
-                          {
-                              radialBar:
-                                  {
-                                      hollow: { margin: 0, size: "70%" },
-                                      track: { dropShadow: { enabled: true, top: 2, left: 0, blur: 4, opacity: 0.15 } },
-                                      dataLabels:
-                                          {
-                                              name: { offsetY: -10, color: "#000", fontSize: "13px" },
-                                              value: { color: "#000", fontSize: "30px", show: true },
-                                          },
-                                  },
-                          },
-                  }
-              graphs:
-                  - collection: lighthouse
-                    field: bestPractices
-                    yAxis: latestValue
-                    graphName: { de: "Best Practices Score", en: "Best Practices Score" }
-                    dateTimeField: insertTime
-
-            - type: graph
-              filter: false
-              graphType: radialBar
-              until: "lastYear"
-              value: total
-              containerProps:
-                  #optional class prop
-                  layout:
-                      breakBefore: false
-                      breakAfter: false
-                      size:
-                          default: "col-6"
-                          small: "col-12"
-                          large: "col-3"
-              options:
-                  {
-                      property: plotOptions,
-                      value:
-                          {
-                              radialBar:
-                                  {
-                                      hollow: { margin: 0, size: "70%" },
-                                      track: { dropShadow: { enabled: true, top: 2, left: 0, blur: 4, opacity: 0.15 } },
-                                      dataLabels:
-                                          {
-                                              name: { offsetY: -10, color: "#000", fontSize: "13px" },
-                                              value: { color: "#000", fontSize: "30px", show: true },
-                                          },
-                                  },
-                          },
-                  }
-              graphs:
-                  - collection: lighthouse
-                    field: seo
-                    yAxis: latestValue
-                    graphName: { de: "SEO Score", en: "SEO Score" }
-                    dateTimeField: insertTime
-
-            - type: swiper # Art des Elements, hier ein Swiper
-              containerProps:
-                  #optional class prop
-                  layout:
-                      breakBefore: false
-                      breakAfter: false
-                      size:
-                          default: "col-12"
-                          small: "col-12"
-                          large: "col-6 row-2-4"
-
-              elements: # Liste der Elemente in diesem Swiper
-                  - type: graph
-                    title:
-                        value: { de: "Ladezeit (Score)", en: "Loadtime (Score)" }
-                    xAxis: manual
-                    until: "lastYear"
-                    filter: false #deaktiviert die Filter möglichkeit für den Nutzer beim diagramm, normalerweise aktiviert. Hierbei sind alle kombinationen x >= until möglich
-                    columns:
-                        - name: { de: '["Erstes sichtbares", "Element"]', en: '["First Contentful", "Paint"]' }
-                          field: lighthouseMetrics.FCPS
-
-                        - name: { de: '["Erstes bedeutsames", "Element"]', en: '["First Meaningful", "Paint"]' }
-                          field: lighthouseMetrics.FMPS
-
-                        - name:
-                              {
-                                  de: '["Maximale potenzielle", "erste", "ingabeverzögerung"]',
-                                  en: '["Max Potential", "First Input", "Delay"]',
-                              }
-                          field: lighthouseMetrics.FPIDS
-
-                        - name: { de: '["Zeit bis", "zur", "Interaktivität"]', en: '["Time to", "Interactive"]' }
-                          field: lighthouseMetrics.TTIS
-
-                        - name: { de: '["Geschwindigkeitsindex"]', en: '["Speed Index"]' }
-                          field: lighthouseMetrics.SIS
-
-                    graphType: "bar"
-                    graphs:
-                        - graphName: { de: "Lighthouse Metriken", en: "Lighthouse Metrics" }
-                          yAxis: latestValue
-                          collection: lighthouse
-                          dateTimeField: insertTime
-                  - type: graph
-                    title:
-                        value: { de: "Ladezeit (Sekunden)", en: "Loadtime (seconds)" }
-                    xAxis: manual
-                    until: "lastYear"
-                    filter: false #deaktiviert die Filter möglichkeit für den Nutzer beim diagramm, normalerweise aktiviert. Hierbei sind alle kombinationen x >= until möglich
-                    columns:
-                        - name: { de: '["Erstes sichtbares", "Element"]', en: '["First Contentful", "Paint"]' }
-                          field: lighthouseMetrics.FCPV
-
-                        - name: { de: '["Erstes bedeutsames", "Element"]', en: '["First Meaningful", "Paint"]' }
-                          field: lighthouseMetrics.FMPV
-
-                        - name:
-                              {
-                                  de: '["Maximale potenzielle", "erste", "ingabeverzögerung"]',
-                                  en: '["Max Potential", "First Input", "Delay"]',
-                              }
-                          field: lighthouseMetrics.FPIDV
-
-                        - name: { de: '["Zeit bis", "zur", "Interaktivität"]', en: '["Time to", "Interactive"]' }
-                          field: lighthouseMetrics.TTIV
-
-                        - name: { de: '["Geschwindigkeitsindex"]', en: '["Speed Index"]' }
-                          field: lighthouseMetrics.SIV
-
-                    graphType: "bar"
-                    graphs:
-                        - graphName: { de: "Lighthouse Metriken", en: "Lighthouse Metrics" }
-                          yAxis: latestValue
-                          collection: lighthouse
-                          dateTimeField: insertTime
-
-            - type: "sectionTitle"
-              title: { de: "Seiteninhalte", en: "Page content" }
-
             - collection: navigation
               type: reference
               style:
@@ -261,60 +22,13 @@ meta:
                   upper: rgba(3, 50, 59, 0.7)
                   lower: rgba(3, 50, 59)
 
-            - collection: module
+        minorItems: []
-              type: reference
-              style:
-                  upper: rgba(3, 50, 59, 0.7)
-                  lower: rgba(3, 50, 59)
-
-            - collection: medialib
-              type: reference
-              style:
-                  upper: rgba(3, 50, 59, 0.7)
-                  lower: rgba(3, 50, 59)
-
-            - type: "sectionTitle"
-              title: { de: "Aktionen", en: "Actions" }
-
-            - collection: lighthouse
-              type: action
-              action: "Lighthouse Durchlauf starten"
-              backgroundAction: true
-              modalText:
-                  {
-                      de: "Zur Analyse der Website werden einige Zeitintensive prozesse gestartet, daher wird dies im Hintergrund ausgeführt. Es kann einige Minuten dauern bis das Dashboard aktuallisiert wird, bitte haben Sie etwas Geduld.",
-                      en: "To analyze the website, some time-intensive processes are started, so this is done in the background. It may take a few minutes for the dashboard to be updated, please be patient.",
-                  }
-              properties:
-                  url: https://www.fontis.de
-                  type: post
-              style:
-                  upper: rgba(3, 50, 59, 0.7)
-                  lower: rgba(3, 50, 59)
-
-        minorItems:
-            - collection: page
-              subNavigation: 0
-            - collection: page
-              subNavigation: 1
-            - collection: page
-              subNavigation: 2
 
 collections:
     - !include collections/navigation.yml
     - !include collections/content.yml
-    - !include collections/module.yml
-    - !include collections/medialib.yml
     - !include collections/backups.yml
-    - !include collections/ssr.yml
-    - !include collections/lighthouse.yml
-    - !include collections/lighthouse-subpaths.yml
 
 assets:
     - name: img
       path: img
-
-jobs:
-    - cron: "0 0 * * 1"
-      type: javascript
-      file: jobs/lighthouse.js

api/config.yml.env

@@ -1,2 +1 @@
-TOKEN=geheim
+TOKEN=geheim
-SSR_TOKEN=owshwerNwoa

api/hooks/clear_cache.js

@@ -1,5 +0,0 @@
-var utils = require("./lib/utils")
-
-;(function () {
-    utils.clearSSRCache()
-})()

api/hooks/config-client.js

@@ -4,9 +4,7 @@ const release = "tibi-docs.dirty"
 if (release && typeof context !== "undefined") {
     context.response.header("X-Release", release)
 }
-const apiClientBaseURL = "/api/"
 
 module.exports = {
     release,
-    apiClientBaseURL,
 }

api/hooks/config.js

@@ -1,26 +1,21 @@
-const apiSsrBaseURL = "http://localhost:8080/api/v1/_/fontis_v2"
-
 module.exports = {
-    apiSsrBaseURL,
     ssrValidatePath: function (path) {
         // validate if path ssr rendering is ok, -1 = NOTFOUND, 0 = NO SSR, 1 = SSR
         // pe. use context.readCollection("product", {filter: {path: path}}) ... to validate dynamic urls
 
-        // // / is de home
+        // / is de home
-        // if (path == "/") return 1
+        if (path == "/") return 1
+
+        // all other sites are in db
+        path = path?.replace(/^\//, "")
 
-        // // all other sites are in db
-        //path = path?.replace(/^\//, "")
-        console.log("PATH:", path)
         // filter for path or alternativePaths
-        const resp = context.db.find("page", {
+        const resp = context.db.find("content", {
             filter: {
-                $and: [{ path }],
+                $or: [{ path }, { "alternativePaths.path": path }],
             },
-
             selector: { _id: 1 },
         })
-        console.log("RESP:", resp?.length)
         if (resp && resp.length) {
             return 1
         }
@@ -28,6 +23,5 @@ module.exports = {
         // not found
         return -1
     },
-    ssrPublishCheckCollections: ["page"],
+    ssrAllowedAPIEndpoints: ["content", "medialib"],
-    LIGHTHOUSE_TOKEN: "AIzaSyC0UxHp3-MpJiDL3ws7pEV6lj57bfIc7GQ",
 }

api/hooks/lib/ssr-server.js

@@ -1,36 +0,0 @@
-const { apiSsrBaseURL, ssrPublishCheckCollections } = require("../config")
-
-/**
- * api request via server, cache result in context.ssrCache
- * should be elimated in client code via tree shaking
- *
- * @param {string} cacheKey
- * @param {string} endpoint
- * @param {ApiOptions} options
- * @returns {ApiResult}
- */
-function ssrRequest(cacheKey, endpoint, query, options) {
-    let url = endpoint + (query ? "?" + query : "")
-
-    // console.log("############ FETCHING ", apiSsrBaseURL + url)
-
-    const response = context.http.fetch(apiSsrBaseURL + "/" + url, {
-        method: options.method,
-        headers: options.headers,
-    })
-
-    const json = response.body.json()
-    const count = parseInt(response.headers["x-results-count"] || "0")
-
-    // json is go data structure and incompatible with js, so we need to convert it
-    const r = { data: JSON.parse(JSON.stringify(json)), count: count }
-
-    // @ts-ignore
-    context.ssrCache[cacheKey] = r
-
-    return r
-}
-
-module.exports = {
-    ssrRequest,
-}

api/hooks/lib/ssr.js

@@ -1,182 +0,0 @@
-const { apiClientBaseURL } = require("../config-client")
-
-/**
- * convert object to string
- * @param {any} obj object
- */
-function obj2str(obj) {
-    if (Array.isArray(obj)) {
-        return JSON.stringify(
-            obj.map(function (idx) {
-                return obj2str(idx)
-            })
-        )
-    } else if (typeof obj === "object" && obj !== null) {
-        var elements = Object.keys(obj)
-            .sort()
-            .map(function (key) {
-                var val = obj2str(obj[key])
-                if (val) {
-                    return key + ":" + val
-                }
-            })
-
-        var elementsCleaned = []
-        for (var i = 0; i < elements.length; i++) {
-            if (elements[i]) elementsCleaned.push(elements[i])
-        }
-
-        return "{" + elementsCleaned.join("|") + "}"
-    }
-
-    if (obj) return obj
-}
-
-// fetch polyfill
-// [MIT License](LICENSE.md) © [Jason Miller](https://jasonformat.com/)
-const _f = function (
-    /** @type {string | URL} */ url,
-    /** @type {{ method?: any; credentials?: any; headers?: any; body?: any; }} */ options
-) {
-    if (typeof XMLHttpRequest === "undefined") {
-        return Promise.resolve(null)
-    }
-
-    options = options || {}
-    return new Promise((resolve, reject) => {
-        const request = new XMLHttpRequest()
-        const keys = []
-        const all = []
-        const headers = {}
-
-        const response = () => ({
-            ok: ((request.status / 100) | 0) == 2, // 200-299
-            statusText: request.statusText,
-            status: request.status,
-            url: request.responseURL,
-            text: () => Promise.resolve(request.responseText),
-            json: () => Promise.resolve(request.responseText).then(JSON.parse),
-            blob: () => Promise.resolve(new Blob([request.response])),
-            clone: response,
-            headers: {
-                // @ts-ignore
-                keys: () => keys,
-                // @ts-ignore
-                entries: () => all,
-                get: (n) => headers[n.toLowerCase()],
-                has: (n) => n.toLowerCase() in headers,
-            },
-        })
-
-        request.open(options.method || "get", url, true)
-
-        request.onload = () => {
-            request
-                .getAllResponseHeaders()
-                // @ts-ignore
-                .replace(/^(.*?):[^\S\n]*([\s\S]*?)$/gm, (m, key, value) => {
-                    keys.push((key = key.toLowerCase()))
-                    all.push([key, value])
-                    headers[key] = headers[key] ? `${headers[key]},${value}` : value
-                })
-            resolve(response())
-        }
-
-        request.onerror = reject
-
-        request.withCredentials = options.credentials == "include"
-
-        for (const i in options.headers) {
-            request.setRequestHeader(i, options.headers[i])
-        }
-
-        request.send(options.body || null)
-    })
-}
-
-const _fetch = typeof fetch === "undefined" ? (typeof window === "undefined" ? _f : window.fetch || _f) : fetch
-
-/**
- * api request via client or server
- * server function ssrRequest is called via context.ssrRequest, binded in ssr hook
- *
- * @param {string} endpoint
- * @param {ApiOptions} options
- * @param {any} body
- * @returns {Promise<ApiResult<any>>}
- */
-function apiRequest(endpoint, options, body) {
-    // TODO cache only for GET
-
-    // first check cache if on client
-    const cacheKey = obj2str({ endpoint: endpoint, options: options })
-    options.method = options?.method || "GET"
-
-    // @ts-ignore
-    if (typeof window !== "undefined" && window.__SSR_CACHE__ && options?.method === "GET") {
-        // @ts-ignore
-        const cache = window.__SSR_CACHE__[cacheKey]
-        console.log("SSR:", cacheKey, cache)
-        if (cache) {
-            return Promise.resolve(cache)
-        }
-    }
-
-    let method = options?.method || "GET"
-
-    let query = "&count=1"
-    if (options?.filter) query += "&filter=" + encodeURIComponent(JSON.stringify(options.filter))
-    if (options?.sort) query += "&sort=" + options.sort + "&sort=_id"
-    if (options?.limit) query += "&limit=" + options.limit
-    if (options?.offset) query += "&offset=" + options.offset
-    if (options?.projection) query += "&projection=" + options.projection
-    if (options?.lookup) query += "&lookup=" + options.lookup
-
-    if (options?.params) {
-        Object.keys(options.params).forEach((p) => {
-            query += "&" + p + "=" + encodeURIComponent(options.params[p])
-        })
-    }
-
-    let headers = {
-        "Content-Type": "application/json",
-    }
-
-    if (options?.headers) headers = { ...headers, ...options.headers }
-
-    if (typeof window === "undefined" && method === "GET") {
-        // server
-
-        // reference via context from get hook to tree shake in client
-        // @ts-ignore
-        const d = context.ssrRequest(cacheKey, endpoint, query, Object.assign({}, options, { method, headers }))
-        return d
-    } else {
-        // client
-        let url = endpoint + (query ? "?" + query : "")
-        console.log("URL:", url)
-        const requestOptions = {
-            method,
-            mode: "cors",
-            headers,
-        }
-
-        if (method === "POST" || method === "PUT") {
-            requestOptions.body = JSON.stringify(body)
-        }
-
-        return _fetch(apiClientBaseURL + url, requestOptions).then((response) => {
-            return response?.json().then((json) => {
-                if (response?.status < 200 || response?.status >= 400) {
-                    return Promise.reject({ response, data: json })
-                }
-                return Promise.resolve({ data: json || null, count: response.headers?.get("x-results-count") || 0 })
-            })
-        })
-    }
-}
-
-module.exports = {
-    obj2str,
-    apiRequest,
-}

api/hooks/lib/utils.js

@@ -46,103 +46,8 @@ function clearSSRCache() {
     context.response.header("X-SSR-Cleared", info.removed)
 }
 
-var { LIGHTHOUSE_TOKEN } = require("../config")
-function calculateAverageDynamically(dbObjs) {
-    const sumObj = {}
-    let count = 0
-
-    dbObjs.forEach((obj) => {
-        accumulate(obj, sumObj)
-        count++
-    })
-
-    function accumulate(sourceObj, targetObj) {
-        for (const key in sourceObj) {
-            if (typeof sourceObj[key] === "number") {
-                targetObj[key] = (targetObj[key] || 0) + sourceObj[key]
-            } else if (typeof sourceObj[key] === "object" && sourceObj[key] !== null) {
-                targetObj[key] = targetObj[key] || {}
-                accumulate(sourceObj[key], targetObj[key])
-            }
-        }
-    }
-
-    function average(targetObj) {
-        for (const key in targetObj) {
-            if (typeof targetObj[key] === "number") {
-                targetObj[key] = targetObj[key] / count
-            } else if (typeof targetObj[key] === "object") {
-                average(targetObj[key])
-            }
-        }
-    }
-
-    average(sumObj)
-    return sumObj
-}
-
-function run(url) {
-    const response = context.http
-        .fetch(url, {
-            timeout: 300,
-            method: "GET",
-            headers: {
-                "Content-Type": "application/json",
-            },
-        })
-        .body.json()
-    // needs enough traffic to be collected
-    const cruxMetrics = {
-        "First Contentful Paint": response?.loadingExperience?.metrics?.FIRST_CONTENTFUL_PAINT_MS?.category,
-        "First Input Delay": response?.loadingExperience?.metrics?.FIRST_INPUT_DELAY_MS?.category,
-    }
-    const lighthouse = response.lighthouseResult
-    const lighthouseMetrics = {
-        FCPS: lighthouse.audits["first-contentful-paint"].score * 100,
-        FCPV: lighthouse.audits["first-contentful-paint"].numericValue / 1000,
-        FMPS: lighthouse.audits["first-meaningful-paint"].score * 100,
-        FMPV: lighthouse.audits["first-meaningful-paint"].numericValue / 1000,
-
-        SIS: lighthouse.audits["speed-index"].score * 100,
-        SIV: lighthouse.audits["speed-index"].numericValue / 1000,
-        TTIS: lighthouse.audits["interactive"].score * 100,
-        TTIV: lighthouse.audits["interactive"].numericValue / 1000,
-
-        FPIDS: lighthouse.audits["max-potential-fid"].score * 100,
-        FPIDV: lighthouse.audits["max-potential-fid"].numericValue / 1000,
-    }
-
-    let dbObject = {
-        cruxMetrics,
-        lighthouseMetrics,
-        performance: Math.round(lighthouse.categories.performance.score * 100),
-        accessibility: Math.round(lighthouse.categories.accessibility.score * 100),
-        bestPractices: Math.round(lighthouse.categories["best-practices"].score * 100),
-        seo: Math.round(lighthouse.categories.seo.score * 100),
-    }
-    return dbObject
-}
-function setUpQuery(subPath = "/") {
-    const api = "https://www.googleapis.com/pagespeedonline/v5/runPagespeed"
-    let params = `category=performance&category=accessibility&category=best-practices&category=seo`
-
-    const parameters = {
-        url: encodeURIComponent(`https://www.fontis.de/${subPath}`),
-        key: LIGHTHOUSE_TOKEN,
-    }
-
-    let query = `${api}?`
-    for (let key in parameters) {
-        query += `${key}=${parameters[key]}&`
-    }
-    query += params // Append other parameters without URL encoding
-    return query
-}
 module.exports = {
     log,
     clearSSRCache,
     obj2str,
-    run,
-    setUpQuery,
-    calculateAverageDynamically,
 }

api/hooks/lighthouse/post_create.js

@@ -1,16 +0,0 @@
-var { setUpQuery, calculateAverageDynamically, run } = require("../lib/utils")
-;(function () {
-    let subPaths = context.db.find("lighthouseSubpath")
-    let urls = []
-    for (let i = 0; i < subPaths.length; i++) {
-        urls.push(setUpQuery(subPaths[i].lighthouseSubpath))
-    }
-    let dbObjs = []
-    urls.forEach((url) => {
-        console.log("URL:", url)
-        dbObjs.push(run(url))
-    })
-    let dbObject = calculateAverageDynamically(dbObjs)
-    dbObject.analyzedPaths = [...subPaths].map((subPath) => subPath.lighthouseSubpath)
-    return { data: dbObject }
-})()

api/hooks/ssr/get_read.js

@@ -1,19 +1,16 @@
-// TODO: add query string functionality to cache
+const { ssrValidatePath, ssrAllowedAPIEndpoints } = require("../config")
-
-const { ssrValidatePath } = require("../config")
-const { log } = require("../lib/utils")
-const { ssrRequest } = require("../lib/ssr-server.js")
 
+const { obj2str, log } = require("../lib/utils")
 ;(function () {
     /** @type {HookResponse} */
-    let response = null
+    var response = null
 
-    const request = context.request()
+    var request = context.request()
-    let url = request.query("url")
+    var url = request.query("url")
-    const noCache = request.query("noCache")
+    var noCache = request.query("noCache")
 
     // add sentry trace id to head
-    const trace_id = context.debug.sentryTraceId()
+    var trace_id = context.debug.sentryTraceId()
     function addSentryTrace(content) {
         return content.replace("</head>", '<meta name="sentry-trace" content="' + trace_id + '" /></head>')
     }
@@ -21,9 +18,7 @@ const { ssrRequest } = require("../lib/ssr-server.js")
 
     if (url) {
         // comment will be printed to html later
-        let comment = ""
+        var comment = ""
-        /** @type {Date} */ // @ts-ignore
-        context.ssrCacheValidUntil = null
 
         url = url.split("?")[0]
         comment += "url: " + url
@@ -36,8 +31,7 @@ const { ssrRequest } = require("../lib/ssr-server.js")
         }
 
         // check if url is in cache
-        /** @type {Ssr[]} */ // @ts-ignore
+        var cache =
-        const cache =
             !noCache &&
             context.db.find("ssr", {
                 filter: {
@@ -46,7 +40,6 @@ const { ssrRequest } = require("../lib/ssr-server.js")
             })
         if (cache && cache.length) {
             // use cache
-            context.response.header("X-SSR-Cache", "true")
             throw {
                 status: 200,
                 log: false,
@@ -55,50 +48,84 @@ const { ssrRequest } = require("../lib/ssr-server.js")
         }
 
         // validate url
-        let status = 200
+        var status = 200
 
-        let pNorender = false
+        var pNorender = false
-        let pNotfound = false
+        var pNotfound = false
 
-        const pR = ssrValidatePath(url)
+        var pR = ssrValidatePath(url)
         if (pR < 0) {
             pNotfound = true
         } else if (!pR) {
             pNorender = true
         }
 
-        let head = ""
+        var head = ""
-        let html = ""
+        var html = ""
-        let error = ""
+        var error = ""
 
         comment += ", path: " + url
 
-        let cacheIt = false
+        var cacheIt = false
         if (pNorender) {
             html = "<!-- NO SSR RENDERING -->"
         } else if (pNotfound) {
             status = 404
             html = "404 NOT FOUND"
         } else {
-            // @ts-ignore
-            context.ssrCache = {}
-            // @ts-ignore
-            context.ssrRequest = ssrRequest
-
             // try rendering, if error output plain html
             try {
+                // @ts-ignore
+                context.ssrCache = {}
+                // @ts-ignore
+                context.ssrFetch = function (endpoint, options) {
+                    var data
+                    if (ssrAllowedAPIEndpoints.indexOf(endpoint) > -1) {
+                        var _options = Object.assign({}, options)
+
+                        if (_options.sort) _options.sort = [_options.sort]
+
+                        try {
+                            /*console.log(
+                                "SSR",
+                                endpoint,
+                                JSON.stringify(_options)
+                            )*/
+                            var goSlice = context.db.find(endpoint, _options || {})
+                            // need to deep copy, so shift and delete on pure js is possible
+                            data = JSON.parse(JSON.stringify(goSlice))
+                        } catch (e) {
+                            console.log("ERROR", JSON.stringify(e))
+                            data = []
+                        }
+                    } else {
+                        console.log("SSR forbidden", endpoint)
+                        data = []
+                    }
+
+                    var count = (data && data.length) || 0
+                    if (options && count == options.limit) {
+                        // read count from db
+                        count = context.db.count(endpoint, _options || {})
+                    }
+                    var r = { data: data, count: count }
+
+                    // @ts-ignore
+                    context.ssrCache[obj2str({ endpoint: endpoint, options: options })] = r
+
+                    return r
+                }
+
                 // include App.svelte and render it
                 // @ts-ignore
-
+                var app = require("../lib/app.server")
-                // console.log("####### RENDERING ", url)
+                var rendered = app.default.render({
-                const app = require("../lib/app.server")
-                const rendered = app.default.render({
                     url: url,
                 })
                 head = rendered.head
                 html = rendered.html
 
-                // add ssrCache to head, cache is built in ssr.js/apiRequest
+                // add ssrCache to head
                 head +=
                     "\n\n" +
                     "<script>window.__SSR_CACHE__ = " +
@@ -109,7 +136,6 @@ const { ssrRequest } = require("../lib/ssr-server.js")
                 // status from webapp
                 // @ts-ignore
                 if (context.is404) {
-                    // console.log("########## 404")
                     status = 404
                 } else {
                     cacheIt = true
@@ -123,7 +149,7 @@ const { ssrRequest } = require("../lib/ssr-server.js")
         }
 
         // read html template and replace placeholders
-        let tpl = context.fs.readFile("templates/spa.html")
+        var tpl = context.fs.readFile("templates/spa.html")
         tpl = tpl.replace("<!--HEAD-->", head)
         tpl = tpl.replace("<!--HTML-->", html)
         tpl = tpl.replace("<!--SSR.ERROR-->", error ? "<!--" + error + "-->" : "")
@@ -132,7 +158,6 @@ const { ssrRequest } = require("../lib/ssr-server.js")
         // save cache if adviced
         if (cacheIt && !noCache) {
             context.db.create("ssr", {
-                // context.debug.dump("ssr", {
                 path: url,
                 content: tpl,
             })
@@ -146,7 +171,7 @@ const { ssrRequest } = require("../lib/ssr-server.js")
         }
     } else {
         // only admins are allowed to get without url parameter
-        const auth = context.user.auth()
+        var auth = context.user.auth()
         if (!auth || auth.role !== 0) {
             throw {
                 status: 403,

api/jobs/lighthouse.js

@@ -1,17 +0,0 @@
-var { setUpQuery, calculateAverageDynamically, run } = require("../hooks/lib/utils")
-;(function () {
-    console.log("Running lighthouse job")
-    let subPaths = context.db.find("lighthouseSubpath")
-    let urls = []
-    for (let i = 0; i < subPaths.length; i++) {
-        urls.push(setUpQuery(subPaths[i].lighthouseSubpath))
-    }
-    let dbObjs = []
-    urls.forEach((url) => {
-        console.log("URL:", url)
-        dbObjs.push(run(url))
-    })
-    let dbObject = calculateAverageDynamically(dbObjs)
-    dbObject.analyzedPaths = [...subPaths].map((subPath) => subPath.lighthouseSubpath)
-    context.db.create("lighthouse", dbObject)
-})()

api/templates/spa.html

@@ -1,34 +0,0 @@
-<!DOCTYPE html>
-<html lang="de">
-    <head>
-        <meta charset="UTF-8" />
-        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-        <title>Fontis</title>
-        <base href="/" />
-
-        <link rel="stylesheet" href="/dist/index.css?t=__TIMESTAMP__" />
-        <link rel="apple-touch-icon" sizes="180x180" href="/media/favicon/apple-touch-icon.png" type="image/x-icon" />
-        <link rel="icon" type="image/png" sizes="32x32" href="/media/favicon/favicon-32x32.png" type="image/x-icon" />
-        <link rel="icon" type="image/png" sizes="16x16" href="/media/favicon/favicon-16x16.png" type="image/x-icon" />
-        <link rel="manifest" href="/site.webmanifest" />
-        <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#343a40" />
-        <meta name="apple-mobile-web-app-title" content="Fontis" />
-        <meta name="application-name" content="Fontis" />
-        <meta name="msapplication-TileColor" content="#343a40" />
-        <meta name="theme-color" content="#ffffff" />
-
-        <script type="text/javascript" src="svg-loader.min.js" async></script>
-        <!--HEAD-->
-
-        <!--PRELOAD-->
-    </head>
-    <body>
-        <div id="appContainer"><!--HTML--></div>
-        <script type="module" src="/dist/index.mjs?t=__TIMESTAMP__"></script>
-        <script nomodule src="/dist/index.es5.js?t=__TIMESTAMP__"></script>
-    </body>
-
-    <!--SSR.ERROR-->
-    <!--SSR.COMMENT-->
-</html>

docker-compose-local.yml

@@ -30,7 +30,7 @@ services:
             - ./tmp/nonexistent:/nonexistent
             - ./tmp/.npm:/.npm
         working_dir: /data
-        command: sh -c "yarn install && API_BASE=http://tibiserver:8080/api/v1/_/${TIBI_NAMESPACE} yarn start${START_SCRIPT}"
+        command: sh -c "yarn install && API_BASE=http://tibiserver:8080/api/v1/_/${TIBI_NAMESPACE} yarn start"
         expose:
             - 3000
         labels:

esbuild.config.js

@@ -1,5 +1,3 @@
-const fs = require("fs")
-
 const resolvePlugin = {
     name: "resolvePlugin",
     setup(build) {
@@ -70,9 +68,7 @@ const bsMiddleware = []
 
 if (process.argv[2] == "start") {
     const { createProxyMiddleware } = require("http-proxy-middleware")
-    const dotEnv = fs.readFileSync(__dirname + "/.env", "utf8")
+    const apiBase = process.env.API_BASE || "http://localhost:8080/api/v1/_/" + process.env.NAMESPACE
-    const TIBI_NAMESPACE = dotEnv.match(/TIBI_NAMESPACE=(.*)/)[1]
-    const apiBase = process.env.API_BASE || "http://localhost:8080/api/v1/_/" + TIBI_NAMESPACE
     bsMiddleware.push(
         createProxyMiddleware("/api", {
             target: apiBase,
@@ -81,39 +77,12 @@ if (process.argv[2] == "start") {
             logLevel: "debug",
         })
     )
-
-    // if SSR env variable is set
-    console.log(process.env, "=========================ENV")
-    if (process.env.SSR) {
-        // read api/config.yml.env and read SSR_TOKEN variable from it
-        const configEnv = fs.readFileSync(__dirname + "/api/config.yml.env", "utf8")
-        const SSR_TOKEN = configEnv.match(/SSR_TOKEN=(.*)/)[1]
-
-        // redirect all other requests to /api/ssr?token=owshwerNwoa&url=...
-        bsMiddleware.push(
-            createProxyMiddleware(
-                function (path, req) {
-                    return !path.match(/\./)
-                },
-                {
-                    target: apiBase,
-                    changeOrigin: true,
-                    logLevel: "debug",
-                    pathRewrite: function (path, req) {
-                        console.log(path)
-                        return "/ssr?token=" + SSR_TOKEN + "&url=" + encodeURIComponent(path)
-                    },
-                }
-            )
-        )
-    }
 }
 
 module.exports = {
     sveltePlugin: sveltePlugin,
     resolvePlugin: resolvePlugin,
     options: options,
-    distDir,
     watch: {
         path: [__dirname + "/" + frontendDir + "/src/**/*"],
     },
@@ -134,6 +103,7 @@ module.exports = {
                 }),
             ],
         },
+        ghostMode: false,
         open: false,
         // logLevel: "debug",
     },

esbuild.config.server.js

@@ -1,3 +1,4 @@
+module.exports = config
 const config = require("./esbuild.config.js")
 const svelteConfig = require("./svelte.config")
 

frontend/.htaccess

@@ -1,19 +1,16 @@
 AddType application/javascript .mjs
 
-#DirectoryIndex spa.html
+#DirectoryIndex index.html spa.html
-# notwendig, da sonst über normale url spa.html aufgerufen wird, muss nur datei name sei, der nicht existiert
+DirectoryIndex spa.html
-DirectoryIndex noindex
 
 <ifModule mod_rewrite.c>
     RewriteEngine On
     RewriteBase /
 
-    RewriteRule ^/?api/(.*)$ http://tibi-server:8080/api/v1/_/fontis_v2/$1 [P,QSA,L]
+    RewriteRule ^/?api/(.*)$ http://tibi-server:8080/api/v1/_/fontis/$1 [P,QSA,L]
 
     RewriteCond %{REQUEST_FILENAME} !-f
     RewriteCond %{REQUEST_FILENAME} !-d
-    # leitet initale request an backend und nicht an spa.html weiter
+   
-    RewriteRule ^/?(.*)$ http://tibi-server:8080/api/v1/_/fontis_v2/ssr?token=owshwerNwoa&url=/$1 [P,QSA,L]
+    RewriteRule (.*) /spa.html [QSA,L]
-    # standardmäßig wegen deeplink aus google notwendig, da sonst 404
-    #RewriteRule (.*) /spa.html [QSA,L]
 </ifModule>

frontend/media/BurgerMenu.svg

@@ -1,3 +1,3 @@
 <svg width="50" height="50" viewBox="0 0 50 50" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path fill="#343a40" d="M10 14h30v2H10zM15 24h25v2H15zM20 34h20v2H20z"/>
+    <path fill="#000" d="M10 14h30v2H10zM15 24h25v2H15zM20 34h20v2H20z"/>
 </svg>

frontend/media/ToTop.svg

@@ -1,5 +1,5 @@
 <svg width="68" height="68" viewBox="0 0 68 68" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <rect x="1" y="1" width="66" height="66" rx="33" fill="#343a40"/>
+    <rect x="1" y="1" width="66" height="66" rx="33" fill="#000"/>
     <path d="M44.91 39.965 34 29.066 23.09 39.965l-1.055-1.055L34 26.934 45.965 38.91l-1.055 1.055z" fill="#fff"/>
     <rect x="1" y="1" width="66" height="66" rx="33" stroke="#fff" stroke-width="2"/>
 </svg>

frontend/media/arrow-l-fat.svg

@@ -1,3 +1,3 @@
 <svg width="75" height="75" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M88 50c0 1.38-1.12 2.5-2.5 2.5H20.608l25.644 25.218a2.502 2.502 0 1 1-3.504 3.564L12.772 50.805a2.49 2.49 0 0 1-.758-2.07c.064-.6.342-1.16.786-1.57L42.748 16.718a2.5 2.5 0 1 1 3.504 3.564L20.608 47.5H85.5c1.38 0 2.5 1.12 2.5 2.5z" fill="#5b6e98" stroke="#5b6e98" stroke-width="10"/>
+    <path d="M88 50c0 1.38-1.12 2.5-2.5 2.5H20.608l25.644 25.218a2.502 2.502 0 1 1-3.504 3.564L12.772 50.805a2.49 2.49 0 0 1-.758-2.07c.064-.6.342-1.16.786-1.57L42.748 16.718a2.5 2.5 0 1 1 3.504 3.564L20.608 47.5H85.5c1.38 0 2.5 1.12 2.5 2.5z" fill="#000" stroke="#000" stroke-width="10"/>
 </svg>

frontend/media/arrow-l.svg

@@ -1,3 +1,3 @@
 <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M44 24c0 .69-.56 1.25-1.25 1.25H10.304l12.822 12.609a1.251 1.251 0 1 1-1.752 1.782L6.386 24.903a1.245 1.245 0 0 1-.379-1.035c.032-.3.171-.58.393-.785L21.374 8.359a1.25 1.25 0 1 1 1.752 1.782L10.304 22.75H42.75c.69 0 1.25.56 1.25 1.25z" fill="#343A40"/>
+    <path d="M44 24c0 .69-.56 1.25-1.25 1.25H10.304l12.822 12.609a1.251 1.251 0 1 1-1.752 1.782L6.386 24.903a1.245 1.245 0 0 1-.379-1.035c.032-.3.171-.58.393-.785L21.374 8.359a1.25 1.25 0 1 1 1.752 1.782L10.304 22.75H42.75c.69 0 1.25.56 1.25 1.25z" fill="#333"/>
 </svg>

frontend/media/arrowr.svg

@@ -1,3 +1,3 @@
 <svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M15.268 4.21a.75.75 0 0 0-1.04 1.08l8.275 7.96H3.75a.75.75 0 1 0 0 1.5h18.752l-8.273 7.959a.75.75 0 0 0 1.04 1.08l9.428-9.069a1 1 0 0 0 0-1.441l-9.428-9.07-.001.001z" fill="#343A40"/>
+    <path d="M15.268 4.21a.75.75 0 0 0-1.04 1.08l8.275 7.96H3.75a.75.75 0 1 0 0 1.5h18.752l-8.273 7.959a.75.75 0 0 0 1.04 1.08l9.428-9.069a1 1 0 0 0 0-1.441l-9.428-9.07-.001.001z" fill="#333"/>
 </svg>

frontend/media/calendar.svg

@@ -1,3 +1,3 @@
 <svg width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M45.5 7.875h-6.125V5.25a.875.875 0 0 0-1.75 0v2.625h-19.25V5.25a.875.875 0 0 0-1.75 0v2.625H10.5A2.625 2.625 0 0 0 7.875 10.5v35a2.625 2.625 0 0 0 2.625 2.625h35a2.625 2.625 0 0 0 2.625-2.625v-35A2.625 2.625 0 0 0 45.5 7.875zm-35 1.75h6.125v2.625a.875.875 0 1 0 1.75 0V9.625h19.25v2.625a.875.875 0 1 0 1.75 0V9.625H45.5a.875.875 0 0 1 .875.875v7.875H9.625V10.5a.875.875 0 0 1 .875-.875zm35 36.75h-35a.875.875 0 0 1-.875-.875V20.125h36.75V45.5a.875.875 0 0 1-.875.875z" fill="#343a40"/>
+    <path d="M45.5 7.875h-6.125V5.25a.875.875 0 0 0-1.75 0v2.625h-19.25V5.25a.875.875 0 0 0-1.75 0v2.625H10.5A2.625 2.625 0 0 0 7.875 10.5v35a2.625 2.625 0 0 0 2.625 2.625h35a2.625 2.625 0 0 0 2.625-2.625v-35A2.625 2.625 0 0 0 45.5 7.875zm-35 1.75h6.125v2.625a.875.875 0 1 0 1.75 0V9.625h19.25v2.625a.875.875 0 1 0 1.75 0V9.625H45.5a.875.875 0 0 1 .875.875v7.875H9.625V10.5a.875.875 0 0 1 .875-.875zm35 36.75h-35a.875.875 0 0 1-.875-.875V20.125h36.75V45.5a.875.875 0 0 1-.875.875z" fill="#000"/>
 </svg>

frontend/media/chev-d.svg

@@ -1,3 +1,3 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="m22.723 5.473 1.054 1.054L12 18.305.223 6.527l1.054-1.054L12 16.195 22.723 5.473z" fill="#343A40"/>
+    <path d="m22.723 5.473 1.054 1.054L12 18.305.223 6.527l1.054-1.054L12 16.195 22.723 5.473z" fill="#333"/>
 </svg>

frontend/media/down.svg

@@ -1,6 +1,6 @@
 <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
     <g clip-path="url(#kvekca80oa)">
-        <path d="m30.797 7.297 1.406 1.406L16.5 24.406.797 8.703l1.406-1.406L16.5 21.594 30.797 7.297z" fill="#343a40"/>
+        <path d="m30.797 7.297 1.406 1.406L16.5 24.406.797 8.703l1.406-1.406L16.5 21.594 30.797 7.297z" fill="#000"/>
     </g>
     <defs>
         <clipPath id="kvekca80oa">

frontend/media/ei close.svg

@@ -1,4 +1,4 @@
 <svg width="50" height="50" viewBox="0 0 50 50" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="m37.304 11.282 1.414 1.414-26.022 26.02-1.414-1.413 26.022-26.021z" fill="#343A40"/>
+    <path d="m37.304 11.282 1.414 1.414-26.022 26.02-1.414-1.413 26.022-26.021z" fill="#333"/>
-    <path d="m12.696 11.282 26.022 26.02-1.414 1.415-26.022-26.02 1.414-1.415z" fill="#343A40"/>
+    <path d="m12.696 11.282 26.022 26.02-1.414 1.415-26.022-26.02 1.414-1.415z" fill="#333"/>
 </svg>

frontend/media/favicon/browserconfig.xml

@@ -1,9 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<browserconfig>
-    <msapplication>
-        <tile>
-            <square150x150logo src="/mstile-150x150.png"/>
-            <TileColor>#343a40</TileColor>
-        </tile>
-    </msapplication>
-</browserconfig>

frontend/media/favicon/safari-pinned-tab.svg

@@ -1,34 +0,0 @@
-<?xml version="1.0" standalone="no"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
- "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
-<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
- width="700.000000pt" height="700.000000pt" viewBox="0 0 700.000000 700.000000"
- preserveAspectRatio="xMidYMid meet">
-<metadata>
-Created by potrace 1.14, written by Peter Selinger 2001-2017
-</metadata>
-<g transform="translate(0.000000,700.000000) scale(0.100000,-0.100000)"
-fill="#000000" stroke="none">
-<path d="M1330 5856 l0 -253 108 -12 c201 -23 358 -70 529 -160 387 -204 661
--568 755 -1004 30 -139 32 -429 4 -557 -71 -329 -211 -582 -446 -803 -231
--218 -558 -362 -868 -384 l-82 -6 2 -260 3 -260 90 2 c111 3 260 24 385 56
-658 166 1189 660 1399 1301 91 278 119 553 86 839 -109 932 -852 1656 -1791
-1745 -60 5 -124 10 -141 10 l-33 0 0 -254z"/>
-<path d="M5500 6080 c-786 -59 -1476 -596 -1726 -1344 -304 -914 93 -1910 946
--2369 235 -127 484 -200 765 -227 61 -5 122 -10 138 -10 l27 0 -2 262 -3 263
--85 7 c-236 18 -473 103 -690 246 -119 78 -308 270 -393 398 -108 163 -175
-323 -219 522 -31 140 -31 434 0 574 87 393 301 712 626 929 189 127 432 217
-632 234 38 3 84 8 102 11 l32 5 -2 252 c-3 244 -4 252 -23 253 -11 1 -67 -2
--125 -6z"/>
-<path d="M2090 4859 c-846 -81 -1553 -699 -1745 -1524 -32 -141 -46 -271 -46
--440 -1 -332 64 -604 212 -896 323 -635 957 -1046 1672 -1082 l87 -5 0 264 0
-264 -47 0 c-69 0 -215 25 -318 55 -389 113 -723 395 -900 760 -233 479 -196
-1013 101 1463 78 118 271 310 393 391 211 140 447 223 704 246 l67 7 0 254 0
-254 -47 -1 c-27 -1 -86 -5 -133 -10z"/>
-<path d="M4730 4593 l0 -253 23 -4 c12 -3 57 -8 100 -11 44 -3 130 -19 192
--35 522 -131 932 -547 1060 -1073 121 -495 -25 -1008 -390 -1372 -247 -248
--563 -397 -895 -423 l-85 -7 -3 -264 -2 -264 102 8 c649 45 1195 360 1547 891
-214 322 322 686 322 1079 0 327 -65 604 -209 890 -100 199 -220 361 -389 526
--120 117 -171 159 -293 239 -297 195 -653 310 -997 322 l-83 3 0 -252z"/>
-</g>
-</svg>

frontend/media/favicon/site.webmanifest

@@ -1,19 +0,0 @@
-{
-    "name": "Fontis",
-    "short_name": "Fontis",
-    "icons": [
-        {
-            "src": "/android-chrome-192x192.png",
-            "sizes": "192x192",
-            "type": "image/png"
-        },
-        {
-            "src": "/android-chrome-512x512.png",
-            "sizes": "512x512",
-            "type": "image/png"
-        }
-    ],
-    "theme_color": "#ffffff",
-    "background_color": "#ffffff",
-    "display": "standalone"
-}

frontend/media/file.svg

@@ -1,4 +1,4 @@
 <svg width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M10.208 47.65a.875.875 0 0 0 .875-.874V11.958a.875.875 0 0 1 .875-.875h20.125v11.375a.875.875 0 0 0 .875.875h11.375v23.334a.875.875 0 0 0 1.75 0V22.458a.875.875 0 0 0-.256-.619L33.577 9.59a.875.875 0 0 0-.619-.256h-21a2.625 2.625 0 0 0-2.625 2.625v34.818c0 .232.256.618.256.618s.387.257.619.257zm23.625-35.33 9.262 9.263h-9.262V12.32z" fill="#343a40"/>
+    <path d="M10.208 47.65a.875.875 0 0 0 .875-.874V11.958a.875.875 0 0 1 .875-.875h20.125v11.375a.875.875 0 0 0 .875.875h11.375v23.334a.875.875 0 0 0 1.75 0V22.458a.875.875 0 0 0-.256-.619L33.577 9.59a.875.875 0 0 0-.619-.256h-21a2.625 2.625 0 0 0-2.625 2.625v34.818c0 .232.256.618.256.618s.387.257.619.257zm23.625-35.33 9.262 9.263h-9.262V12.32z" fill="#000"/>
-    <path d="M10.102 48.523a2.625 2.625 0 0 1-.769-1.856h1.75a.875.875 0 0 0 .875.875h31.5a.875.875 0 0 0 .875-.875h1.75a2.625 2.625 0 0 1-2.625 2.625h-31.5a2.625 2.625 0 0 1-1.856-.77z" fill="#343a40"/>
+    <path d="M10.102 48.523a2.625 2.625 0 0 1-.769-1.856h1.75a.875.875 0 0 0 .875.875h31.5a.875.875 0 0 0 .875-.875h1.75a2.625 2.625 0 0 1-2.625 2.625h-31.5a2.625 2.625 0 0 1-1.856-.77z" fill="#000"/>
 </svg>

frontend/media/up.svg

@@ -1,6 +1,6 @@
 <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
     <g clip-path="url(#3k3057tu3a)">
-        <path d="M31.047 23.953 16.5 9.422 1.953 23.953.547 22.547 16.5 6.578l15.953 15.969-1.406 1.406z" fill="#343a40"/>
+        <path d="M31.047 23.953 16.5 9.422 1.953 23.953.547 22.547 16.5 6.578l15.953 15.969-1.406 1.406z" fill="#000"/>
     </g>
     <defs>
         <clipPath id="3k3057tu3a">

frontend/spa.html

@@ -6,19 +6,12 @@
         <meta http-equiv="X-UA-Compatible" content="IE=edge" />
         <title>Fontis</title>
         <base href="/" />
-
         <link rel="stylesheet" href="/dist/index.css?t=__TIMESTAMP__" />
-        <link rel="apple-touch-icon" sizes="180x180" href="/media/favicon/apple-touch-icon.png" type="image/x-icon" />
+        <script
-        <link rel="icon" type="image/png" sizes="32x32" href="/media/favicon/favicon-32x32.png" type="image/x-icon" />
+            type="text/javascript"
-        <link rel="icon" type="image/png" sizes="16x16" href="/media/favicon/favicon-16x16.png" type="image/x-icon" />
+            src="https://unpkg.com/external-svg-loader@latest/svg-loader.min.js"
-        <link rel="manifest" href="/site.webmanifest" />
+            async
-        <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#343a40" />
+        ></script>
-        <meta name="apple-mobile-web-app-title" content="Fontis" />
-        <meta name="application-name" content="Fontis" />
-        <meta name="msapplication-TileColor" content="#343a40" />
-        <meta name="theme-color" content="#ffffff" />
-
-        <script type="text/javascript" src="svg-loader.min.js" async></script>
         <!--HEAD-->
 
         <!--PRELOAD-->

frontend/src/App.svelte

@@ -4,26 +4,13 @@
     import Menu from "./lib/components/Menu/Menu.svelte"
     import NotFound from "./lib/components/NotFound.svelte"
     import Rows from "./lib/components/Pagebuilder/Rows.svelte"
-    import {
+    import { location, navigation, pages, serviceNavigation, rerender } from "./lib/store"
-        location,
-        navigation,
-        pages,
-        serviceNavigation,
-        rerender,
-        mediaLibrary,
-        team,
-        jobOffers,
-        modules,
-    } from "./lib/store"
     import { onMount, onDestroy } from "svelte"
     import { Route, Router } from "svelte-routing"
     import { loadPages } from "./lib/functions/getPages"
     import { loadNavigation } from "./lib/functions/loadNavigation"
     import ScrollTop from "./lib/components/widgets/scrollTop.svelte"
     import ScrollDown from "./lib/components/widgets/scrollDown.svelte"
-    import { loadLibrary } from "./lib/functions/loadLibrary"
-    import { loadModules } from "./lib/functions/loadModules"
-    import "external-svg-loader"
     export let url = ""
 
     if (url) {
@@ -41,25 +28,11 @@
     async function getPages() {
         let pagesArray = await loadPages()
         let pagesRes: Pages = {}
-        let teamRes: Pages = {}
-        let jobOffersRes: Pages = {}
 
         pagesArray.forEach((e) => {
-            if (!e.active) return
+            pagesRes[e.path] = e
-            if (e.type == "page") {
-                pagesRes[e.path] = e
-            } else if (e.type == "teamMembers") {
-                teamRes[e.path] = e
-            } else if (e.type == "jobOffers") {
-                jobOffersRes[Math.random()] = e
-            } else {
-                pagesRes[e.path] = e
-            }
         })
         $pages = pagesRes
-        $team = teamRes
-
-        $jobOffers = jobOffersRes
     }
 
     async function getNavigation() {
@@ -68,37 +41,15 @@
         $serviceNavigation = nav[1]
     }
 
-    async function getLibrary() {
-        let library: MediaLibrary[] = await loadLibrary()
-        let lib = {}
-        library.forEach((e) => {
-            lib[e.id] = e
-        })
-        $mediaLibrary = lib
-    }
-
-    async function getModules() {
-        let moduleArray: Module[] = await loadModules()
-        let mod = {}
-        moduleArray.forEach((e) => {
-            mod[e.id] = e
-        })
-        $modules = mod
-    }
-
     getNavigation()
     getPages()
-    getLibrary()
+
-    getModules()
-    console.log("TESTR")
     let activeMenu = false
     $: {
-        if (typeof window !== "undefined") {
+        if (activeMenu) {
-            if (activeMenu) {
+            document.body.classList.add("overflow")
-                document.body.classList.add("overflow")
+        } else {
-            } else {
+            document.body.classList.remove("overflow")
-                document.body.classList.remove("overflow")
-            }
         }
     }
 </script>

frontend/src/api.ts

@@ -1,12 +1,121 @@
-import { apiRequest } from "../../api/hooks/lib/ssr"
+import { apiBaseURL } from "./config"
+
+const _f = function (url, options): Promise<Response> {
+    if (typeof XMLHttpRequest === "undefined") {
+        return Promise.resolve(null)
+    }
+
+    options = options || {}
+    return new Promise((resolve, reject) => {
+        const request = new XMLHttpRequest()
+        const keys = []
+        const all = []
+        const headers = {}
+
+        const response = (): Response => ({
+            ok: ((request.status / 100) | 0) == 2, // 200-299
+            statusText: request.statusText,
+            status: request.status,
+            url: request.responseURL,
+            text: () => Promise.resolve(request.responseText),
+            json: () => Promise.resolve(request.responseText).then(JSON.parse),
+            blob: () => Promise.resolve(new Blob([request.response])),
+            clone: response,
+            headers: {
+                // @ts-ignore
+                keys: () => keys,
+                // @ts-ignore
+                entries: () => all,
+                get: (n) => headers[n.toLowerCase()],
+                has: (n) => n.toLowerCase() in headers,
+            },
+        })
+
+        request.open(options.method || "get", url, true)
+
+        request.onload = () => {
+            request
+                .getAllResponseHeaders()
+                // @ts-ignore
+                .replace(/^(.*?):[^\S\n]*([\s\S]*?)$/gm, (m, key, value) => {
+                    keys.push((key = key.toLowerCase()))
+                    all.push([key, value])
+                    headers[key] = headers[key] ? `${headers[key]},${value}` : value
+                })
+            resolve(response())
+        }
+
+        request.onerror = reject
+        request.withCredentials = options.credentials == "include"
+        for (const i in options.headers) {
+            request.setRequestHeader(i, options.headers[i])
+        }
+        request.send(options.body || null)
+    })
+}
+
+const _fetch = typeof fetch === "undefined" ? (typeof window === "undefined" ? _f : window.fetch || _f) : fetch
 
 export const api = async <T>(
     endpoint: string,
-    options?: ApiOptions,
+    options?: {
+        method?: string
+        filter?: any
+        sort?: string
+        limit?: number
+        offset?: number
+        projection?: string
+        headers?: {
+            [key: string]: string
+        }
+        params?: {
+            [key: string]: string
+        }
+    },
     body?: any
 ): Promise<{ data: T; count: number } | any> => {
-    let data = await apiRequest(endpoint, options, body)
+    if (typeof window === "undefined") {
+        // ssr
+        // @ts-ignore
+        return context.ssrFetch(endpoint, options)
+    }
+
+    let method = options?.method || "GET"
+
+    let query = "&count=1"
+    if (options?.filter) query += "&filter=" + encodeURIComponent(JSON.stringify(options.filter))
+    if (options?.sort) query += "&sort=" + options.sort + "&sort=_id"
+    if (options?.limit) query += "&limit=" + options.limit
+    if (options?.offset) query += "&offset=" + options.offset
+    if (options?.projection) query += "&projection=" + options.projection
+
+    if (options?.params) {
+        Object.keys(options.params).forEach((p) => {
+            query += "&" + p + "=" + encodeURIComponent(options.params[p])
+        })
+    }
+
+    let headers: any = {
+        "Content-Type": "application/json",
+    }
+
+    if (options?.headers) headers = { ...headers, ...options.headers }
+
+    let url = apiBaseURL + endpoint + (query ? "?" + query : "")
+
+    const requestOptions: any = {
+        method,
+        mode: "cors",
+        headers,
+    }
+
+    if (method === "POST" || method === "PUT") {
+        requestOptions.body = JSON.stringify(body)
+    }
+
+    let response = await _fetch(url, requestOptions)
+    if (response.status == 409 || response.status == 401) return response
+    let data = (await response?.json()) || null
     // @ts-ignore
-    console.log(data, "data")
+    return { data }
-    return data
 }

frontend/src/config.ts

@@ -1,6 +1,5 @@
 import configClient from "../../api/hooks/config-client"
 
 export const apiBaseURL = "/api/"
-export const baseURL = "https://www.fontis.de"
 export const release = configClient.release
 console.log("Release: ", release)

frontend/src/index.ts

@@ -11,7 +11,7 @@ const publishLocation = (_p?: string) => {
         if (_h) _h = "#" + _h
 
         const parts2 = _p.split("?")
-        _p = parts2.shift()
+    _p = parts2.shift()
         _s = parts2.join()
         if (_s) _s = "?" + _s
     }

frontend/src/lib/assets/css/base.less

@@ -8,7 +8,7 @@ html {
     background-color: black;
 }
 body {
-    color: #343a40 !important;
+    color: #333 !important;
     height: 100%;
     background-color: #f9f9f9;
 }
@@ -16,14 +16,7 @@ body {
 ul {
     list-style-type: none;
 }
-.boxes {
+
-    .content {
-        ul {
-            padding-left: 20px;
-            list-style-type: disc;
-        }
-    }
-}
 ol {
     list-style-type: decimal;
 }
@@ -34,7 +27,6 @@ a {
     font-weight: 700;
     color: inherit;
     font-weight: normal;
-    cursor: pointer;
 }
 
 /* Tabellen */
@@ -64,11 +56,11 @@ button {
     border: none;
     cursor: pointer;
     font-size: inherit;
-    color: #343a40;
+    color: #333;
 }
 input,
 select {
-    color: #343a40;
+    color: #333;
     width: 100%;
 }
 .underline {
@@ -116,7 +108,7 @@ select {
     top: 0px;
     bottom: 0px;
     width: 0px;
-    background: #343a40;
+    background: #000000;
     transition: width 0.5s ease-in;
 }
 .fill:hover:after,
@@ -151,7 +143,7 @@ swiper-slide {
             z-index: 10000;
             left: 0px;
             bottom: -10px;
-            background: @signal-color;
+            background: #000000;
             height: 5px;
             width: 0;
             animation: underlineEffect 15s linear forwards;

frontend/src/lib/assets/css/main.less

@@ -1,8 +1,7 @@
 @bg-color: #fff;
-@bg-color-secondary: #343a40;
+@bg-color-secondary: #000;
-@font-color: #343a40;
+@font-color: #000;
 @font-color-secondary: #fff;
-@signal-color: #5b6e98;
 
 @desktop_large:~ "only screen and (min-width: 1200px)";
 @desktop:~ "only screen and (min-width: 1024px)";

frontend/src/lib/components/Footer.svelte

@@ -4,10 +4,9 @@
     let nextpage = $navigation?.pages[0]
     $: nextpage = $navigation?.pages[0]
     function getNextPage(pages) {
-        if (location.pathname == "/" || location.pathname == "") {
+        console.log(pages, "pages")
-            $navigation?.pages?.length > 1 ? (nextpage = $navigation?.pages[1]) : (nextpage = $navigation?.pages[0])
+        if (location.pathname == "/" || location.pathname == "") return
-            return
+
-        }
         let currPage = pages.find(
             (page) => Object.values($pages)?.find((o) => o.id == page.page)?.path == location.pathname
         )
@@ -22,37 +21,33 @@
         nextpage = pages[nextIndex]
     }
     let blackBg = false
-    if (typeof window !== "undefined") {
+    setInterval(() => {
-        setInterval(() => {
+        if (location.pathname == "/") {
-            if (location.pathname == "/") {
+            blackBg = true
-                blackBg = true
+        } else {
-            } else {
+            blackBg = false
-                blackBg = false
+        }
-            }
 
-            getNextPage($navigation.pages)
+        getNextPage($navigation.pages)
 
-            if (location.pathname.split("/").filter((s) => s).length >= 2) {
+        if (location.pathname.split("/").filter((s) => s).length >= 2) {
-                showNext = false
+            showNext = false
-            } else {
+        } else {
-                showNext = true
+            showNext = true
-            }
+        }
-        }, 1000)
+    }, 1000)
-    }
     let showNext = true
     $: {
-        if (typeof window !== "undefined") {
+        if ($rerender) {
-            if ($rerender) {
+            if (location.pathname != "/") {
-                if (location.pathname != "/") {
+                getNextPage($navigation.pages)
-                    getNextPage($navigation.pages)
-                }
-            }
-            if (location.pathname.split("/").filter((s) => s).length >= 2) {
-                showNext = false
-            } else {
-                showNext = true
             }
         }
+        if (location.pathname.split("/").filter((s) => s).length >= 2) {
+            showNext = false
+        } else {
+            showNext = true
+        }
     }
 </script>
 

frontend/src/lib/components/Menu/Menu.svelte

@@ -8,82 +8,57 @@
 <div class="menu" class:active="{active}">
     <div class="menu-container">
         <Header bind:active="{active}" opened="{true}" />
-
+        <div class="menu-content">
-        <nav class="menu-content">
             {#if $navigation}
                 <div class="container">
                     <div class="inner-container">
-                        <ul class="pages">
+                        <div class="pages">
                             {#each $navigation.pages as page}
                                 {#if Object.values($pages)?.find((o) => o.id == page.page)?.path !== "/"}
-                                    <li>
+                                    <button
-                                        <!-- svelte-ignore a11y-click-events-have-key-events -->
+                                        class="page underline"
-                                        <!-- svelte-ignore a11y-missing-attribute -->
+                                        on:click="{() => {
-                                        <a
+                                            active = false
-                                            style="text-decoration: none;"
+                                            $rerender = $rerender + 1
-                                            class="page underline"
+                                            navigate(Object.values($pages)?.find((o) => o.id == page.page)?.path || '/')
-                                            on:click="{() => {
+                                        }}"
-                                                active = false
+                                    >
-                                                $rerender = $rerender + 1
+                                        {page.name}
-                                                navigate(
+                                    </button>{/if}
-                                                    Object.values($pages)?.find((o) => o.id == page.page)?.path || '/'
-                                                )
-                                            }}"
-                                        >
-                                            {page.name}
-                                        </a>
-                                    </li>
-                                {/if}
                             {/each}
-                        </ul>
+                        </div>
-
                         <div class="footer-infos">
                             <div class="upper">
-                                <!-- svelte-ignore a11y-click-events-have-key-events -->
+                                <button
-                                <!-- svelte-ignore a11y-missing-attribute -->
-                                <a
-                                    style="text-decoration: none;"
                                     class="underline"
                                     on:click="{() => {
                                         active = false
                                         $rerender = $rerender + 1
                                         navigate('/datenschutz')
-                                    }}">Datenschutz</a
+                                    }}">Datenschutz</button
                                 >
-                                <!-- svelte-ignore a11y-click-events-have-key-events -->
+                                <button
-                                <!-- svelte-ignore a11y-missing-attribute -->
-                                <a
-                                    style="text-decoration: none;"
                                     class="underline"
                                     on:click="{() => {
                                         active = false
                                         $rerender = $rerender + 1
                                         navigate('/impressum')
-                                    }}">Impressum</a
+                                    }}">Impressum</button
-                                >
-                                <a
-                                    style="text-decoration: none;"
-                                    class="underline"
-                                    download
-                                    href="/media/Anfahrtsbeschreibung_FONTIS-4.pdf"
-                                    target="_blank">Anfahrt</a
                                 >
                             </div>
-                            <!-- svelte-ignore a11y-missing-attribute -->
                             <div class="lower">
-                                <!-- svelte-ignore a11y-missing-attribute -->
+                                <button>+49 (0) 711 655 700-0</button>
-                                <a>+49 (0) 711 655 700-0</a>
+                                <button>
-                                <a>
                                     <a href="mailto:info@fontis.de" style="text-decoration: none;" class="button">
                                         info@fontis.de
                                     </a>
-                                </a>
+                                </button>
                             </div>
                         </div>
                     </div>
                 </div>
             {/if}
-        </nav>
+        </div>
     </div>
 </div>
 
@@ -180,10 +155,12 @@
                                 }
                                 gap: 20px;
                             }
-                            a {
+                            button {
                                 color: @font-color-secondary;
-                                font-weight: normal;
+                                a {
-                                text-decoration: initial;
+                                    color: @font-color-secondary;
+                                    font-weight: normal;
+                                }
                             }
                             @media @desktop {
                                 .lower {

frontend/src/lib/components/Pagebuilder/Homepage.svelte

@@ -5,8 +5,6 @@
     import TextLink from "../widgets/textLink.svelte"
 
     let teasers = Object.values($pages)?.map((page) => ({ teaser: page.teaser, path: page.path }))
-    $: teasers = Object.values($pages)?.map((page) => ({ teaser: page.teaser, path: page.path }))
-    console.log("teasers:", teasers)
 
     register(false)
     let swiper
@@ -27,29 +25,25 @@
             Object.assign(swiper, params)
             swiper.initialize()
 
-            if (typeof window !== "undefined") {
+            // Add the 'active' class to the h1 of the first slide
-                // Add the 'active' class to the h1 of the first slide
+            const firstSlideH1 = document.querySelector(".swiper-slide-active .titles h1")
-                const firstSlideH1 = document.querySelector(".swiper-slide-active .titles h1")
+            if (firstSlideH1) {
-                if (firstSlideH1) {
+                firstSlideH1.classList.add("active")
-                    firstSlideH1.classList.add("active")
-                }
             }
         }
     })
 
     function handleSlideChange() {
-        if (typeof window !== "undefined") {
+        document.querySelectorAll(".titles h1").forEach((h1) => {
-            document.querySelectorAll(".titles h1").forEach((h1) => {
+            h1.classList.remove("active")
-                h1.classList.remove("active")
+        })
-            })
 
-            setTimeout(() => {
+        setTimeout(() => {
-                const activeSlideUnderline = document.querySelector(".swiper-slide-active .titles h1")
+            const activeSlideUnderline = document.querySelector(".swiper-slide-active .titles h1")
-                if (activeSlideUnderline) {
+            if (activeSlideUnderline) {
-                    activeSlideUnderline.classList.add("active")
+                activeSlideUnderline.classList.add("active")
-                }
+            }
-            }, 600)
+        }, 600)
-        }
     }
     let teaser = teasers[0]
 </script>
@@ -139,7 +133,6 @@
                     line-height: 1;
                     font-weight: 500;
                     position: relative;
-                    color: @signal-color;
                 }
 
                 h2 {

frontend/src/lib/components/Pagebuilder/Module.svelte

@@ -1,37 +0,0 @@
-<script lang="ts">
-    import { jobOffers, modules, team } from "../../store"
-    import Worldcard from "../widgets/Worldcard/worldcard.svelte"
-    import Boxlist from "../widgets/boxlist.svelte"
-    import ExtendableBox from "../widgets/extendableBox.svelte"
-    import IconCycleBox from "../widgets/iconCycleBox.svelte"
-    import IconCycleCircle from "../widgets/iconCycleCircle.svelte"
-    import PageLinkBlocks from "../widgets/pageLinkBlocks.svelte"
-    import Persons from "../widgets/persons.svelte"
-
-    export let col: { contentType: "moduleImport"; moduleImport: string }
-    export let pageId: string
-
-    let module = $modules[col.moduleImport] || {}
-    $: module = $modules[col.moduleImport] || {}
-    $: console.log(
-        "peron",
-        $team,
-        Object.values($team).filter((p) => p.personType == "employee")
-    )
-</script>
-
-{#if module.type == "iconCycleCircle"}
-    <IconCycleCircle iconCycleCircle="{module.iconCycleCircle}" pageId="{pageId}" />
-{:else if module.type == "iconCycleSquare"}
-    <IconCycleBox iconCycleSquare="{module.iconCycleSquare}" pageId="{pageId}" />
-{:else if module.type == "worldCard"}
-    <Worldcard worldCard="{module.worldCard}" pageId="{pageId}" />
-{:else if module.type == "chefTeam"}
-    <Persons persons="{Object.values($team).filter((p) => p.personType == 'chef')}" pageId="{pageId}" />
-{:else if module.type == "employeeTeam"}
-    <Boxlist persons="{Object.values($team).filter((p) => p.personType == 'employee')}" />
-{:else if module.type == "jobOffer"}
-    <ExtendableBox pages="{Object.values($jobOffers)}" />
-{:else if module.type == "jobOfferLink"}
-    <PageLinkBlocks pages="{Object.values($jobOffers)}" pageReference="{module.jobOfferPage}" />
-{/if}

frontend/src/lib/components/Pagebuilder/Pagebuilder.svelte

@@ -14,40 +14,45 @@
     import TextLink from "../widgets/textLink.svelte"
     import TopDown from "../widgets/topDown.svelte"
     import WorldCard from "../widgets/Worldcard/worldcard.svelte"
-    import { modules, pages, rerender, team } from "../../store"
+    import { pages, rerender } from "../../store"
     import IconCycleCircle from "../widgets/iconCycleCircle.svelte"
     import IconCycleBox from "../widgets/iconCycleBox.svelte"
-    import Module from "./Module.svelte"
 
     export let row: Row
     export let pageId: string
     export let bright: boolean
     export let isHP: boolean
-    export let i: number
+
-    export let page: Page
+    function checkNestedPath() {
-    export let personPage: boolean
+        const pathSegments = location.pathname.split("/").filter((segment) => segment.length)
-    if (typeof window !== "undefined") {
+
-        window.addEventListener("popstate", function (event) {
+        if (pathSegments.length > 1) {
-            $rerender = $rerender + 1
+            pathSegments.pop() // remove the last segment
-        })
+            return "/" + pathSegments.join("/")
+        }
+
+        return ""
     }
+    let nestedPath = checkNestedPath()
+    window.addEventListener("popstate", function (event) {
+        $rerender = $rerender + 1
+    })
 </script>
 
 {#if Object.keys(row).length}
     {#if row.topTitle}
-        <h3 class="{row.topTitleUpperCase ? 'hph3' : 'nmh3'}">
+        <h3 class="{row.topTitleUpperCase ? 'hph3' : 'nmh3'}" class:red="{row.topTitleRed}">
             {row.topTitle}
         </h3>
     {/if}
-    {#if personPage}
+    {#if nestedPath}
         <div class="top-header" style="display: flex; width: 100%; justify-content: space-between;">
             <h3
                 style="cursor: pointer; display: flex; align-items: center; gap: 10px; line-height: 1.4;"
                 on:keydown
                 on:click="{() => {
-                    navigate('/' + location.pathname.split('/').at(1))
-
                     $rerender = $rerender + 1
+                    navigate(nestedPath)
                 }}"
             >
                 <img src="/media/arrow-l.svg" alt="arrow" /> Zurück zur Übersicht
@@ -56,22 +61,16 @@
                 style="cursor: pointer; display: flex; align-items: center; gap: 10px; line-height: 1.4;"
                 on:keydown
                 on:click="{() => {
-                    let chefs = Object.values($team).filter((p) => p.personType == 'chef')
-                    chefs = chefs.sort((a, b) => a.sort - b.sort)
-                    let i = chefs.findIndex((p) => p.path == page.path)
-                    if (i == chefs.length - 1) i = 0
-                    else i++
-                    navigate(chefs[i].path)
-
                     $rerender = $rerender + 1
+                    navigate(row?.nextPage || nestedPath)
                 }}"
             >
                 Zum nächsten Profil <img src="/media/arrowr.svg" alt="arrow" />
             </h3>
         </div>
     {/if}
-    {#if page.pageTitle && i == 0}
+    {#if row.pageTitle}
-        <h1>{page.pageTitle}</h1>
+        <h1>{row.pageTitle}</h1>
     {/if}
     {#if row.title}
         <h2 class="">{row.title}</h2>
@@ -84,16 +83,10 @@
             class="row"
             class:twoToThree="{row.twoToThree}"
             class:normalWrap="{row.flexWrapNormal}"
-            class:dominant="{row.columns.some(
+            class:dominant="{row.columns.some((col) => col.contentType == 'iconCycleCircle')}"
-                (col) => col.contentType == 'moduleImport' && $modules?.[col.moduleImport]?.type == 'iconCycleCircle'
-            )}"
         >
             {#each row?.columns as col}
-                <div
+                <div class="col" class:dominant="{col.contentType == 'iconCycleCircle'}">
-                    class="col"
-                    class:dominant="{col.contentType == 'moduleImport' &&
-                        $modules?.[col.moduleImport]?.type == 'iconCycleCircle'}"
-                >
                     {#if col?.contentType == "text"}
                         <Text text="{col?.text}" />
                     {:else if col?.contentType == "textLink"}
@@ -102,12 +95,12 @@
                             path="{Object.values($pages)?.find((o) => o.id == col.textLink.link)?.path || '/'}"
                             bright="{bright}"
                         />
-                    {:else if col.contentType == "moduleImport"}
-                        <Module col="{col}" pageId="{pageId}" />
                     {:else if col.contentType == "image"}
                         <Image image="{col?.image}" col="{col}" pageId="{pageId}" />
                     {:else if col.contentType == "iconBlocks"}
                         <IconBlock pageId="{pageId}" col="{col}" />
+                    {:else if col.contentType == "pageLinkBlocks"}
+                        <PageLinkBlocks col="{col}" />
                     {:else if col.contentType == "networkEvents"}
                         <Events col="{col}" pageId="{pageId}" />
                     {:else if col.contentType == "publications"}
@@ -118,6 +111,18 @@
                         <InfoBoard col="{col}" pageId="{pageId}" />
                     {:else if col.contentType == "nestedCard"}
                         <NestedCard col="{col}" />
+                    {:else if col.contentType == "boxlist"}
+                        <Boxlist col="{col}" />
+                    {:else if col.contentType == "extendableBoxes"}
+                        <ExtendableBox col="{col}" />
+                    {:else if col.contentType == "personPreview"}
+                        <Persons col="{col}" pageId="{pageId}" />
+                    {:else if col.contentType == "iconCycleCircle"}
+                        <IconCycleCircle col="{col}" pageId="{pageId}" />
+                    {:else if col.contentType == "iconCycleSquare"}
+                        <IconCycleBox col="{col}" pageId="{pageId}" />
+                    {:else if col.contentType == "worldCard"}
+                        <WorldCard col="{col}" pageId="{pageId}" />
                     {/if}
                 </div>
             {/each}
@@ -143,7 +148,6 @@
     h1 {
         font-weight: 500;
         font-size: 2rem;
-        color: @signal-color;
     }
     .top-header {
         img {

frontend/src/lib/components/Pagebuilder/Rows.svelte

@@ -1,81 +1,46 @@
 <script lang="ts">
-    import { mediaLibrary, pages, scrollToRowNr, team } from "../../store"
+    import { pages, scrollToRowNr } from "../../store"
     import Homepage from "./Homepage.svelte"
     import Pagebuilder from "./Pagebuilder.svelte"
-    import { apiBaseURL, baseURL } from "../../../config"
+    import { apiBaseURL } from "../../../config"
     import { onMount } from "svelte"
 
-    export let path: string
+    export let path
     export let homepage = false
     export let image: FileField
     let page: Page
-    let personPage = false
     function initPage() {
-        if ($pages[path]) {
+        page = $pages[path]
-            page = $pages[path]
-        } else if (
-            Object.values($team)
-                .map((p) => p.path == path)
-                .includes(true)
-        ) {
-            page = Object.values($team).find((p) => p.path == path)
-            personPage = true
-        }
     }
 
     onMount(() => {
-        if (typeof window !== "undefined") {
+        if ($scrollToRowNr !== -1) {
-            if ($scrollToRowNr !== -1) {
+            console.log("test321-", $scrollToRowNr)
-                if (!$scrollToRowNr) {
+            if (!$scrollToRowNr) {
-                    $scrollToRowNr = -1
-                    return
-                }
-                let element = document.getElementById("row-" + $scrollToRowNr)
-                if (!element) {
-                    $scrollToRowNr = -1
-                    return
-                }
-
-                element?.scrollIntoView({
-                    behavior: "smooth",
-                })
                 $scrollToRowNr = -1
+                return
             }
+            let element = document.getElementById("row-" + $scrollToRowNr)
+            console.log(element)
+            if (!element) {
+                $scrollToRowNr = -1
+                return
+            }
+
+            element?.scrollIntoView({
+                behavior: "smooth",
+            })
+            $scrollToRowNr = -1
         }
     })
 
     $: {
-        if (Object.keys($pages).length || Object.keys($team).length) {
+        if (Object.keys($pages).length) {
             initPage()
         }
     }
 </script>
 
-<svelte:head>
-    {#key page}
-        <!-- Title -->
-        {#if page?.pageTitle}
-            <title>{page.pageTitle}</title>
-        {:else if page?.meta?.title}
-            <title>{page.meta.title}</title>
-        {/if}
-
-        <!-- Description -->
-        {#if page?.meta?.description}
-            <meta name="description" content="{page.meta.description}" />
-        {/if}
-
-        <!-- Keywords -->
-        {#if page?.meta?.keywords}
-            <meta name="keywords" content="{page.meta.keywords}" />
-        {/if}
-
-        {#if page?.active === false}
-            <meta name="robots" content="noindex" />
-        {/if}
-        <link rel="canonical" href="{baseURL + page?.path}" />
-    {/key}
-</svelte:head>
 <div class="rows" class:HP="{path == '/'}">
     {#if page}
         {#if path == "/"}<Homepage />{/if}
@@ -85,29 +50,22 @@
                 id="row-{i}"
                 style="{path == '/' && i == page.rows.length - 1
                     ? 'padding-bottom: 300px; margin-bottom: -40px;'
-                    : ''} {row.noBottomMargin ? 'margin-bottom: 0px; padding-bottom: 0px;' : ''} {row.noTopMargin
+                    : ''} {row.row.noBottomMargin ? 'margin-bottom: 0px; padding-bottom: 0px;' : ''} {row.row
+                    .noTopMargin
                     ? 'margin-top: 0px; padding-top: 0px;'
                     : ''}"
             >
-                {#if row.backgroundImage && $mediaLibrary[row.backgroundImage]}
+                {#if row.row.backgroundImage}
                     <div class="background-image">
-                        <img
+                        <img src="{`${apiBaseURL}page/${page.id}/${row.row.backgroundImage?.src}`}" alt="img" />
-                            src="{`${apiBaseURL}medialib/${row?.backgroundImage}/${
-                                $mediaLibrary?.[row?.backgroundImage]?.file?.src
-                            }`}"
-                            alt="img"
-                        />
                     </div>
                 {/if}
-                <div class="content" class:bright="{row.backgroundImage}">
+                <div class="content" class:bright="{row.row.backgroundImage}">
                     <Pagebuilder
-                        personPage="{personPage}"
                         isHP="{path == '/'}"
-                        i="{i}"
+                        row="{row.row}"
-                        row="{row}"
-                        page="{page}"
                         pageId="{page.id}"
-                        bright="{!!row.backgroundImage}"
+                        bright="{!!row.row.backgroundImage}"
                     />
                 </div>
             </div>

frontend/src/lib/components/widgets/Worldcard/card.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">
     import { apiBaseURL } from "../../../../config"
-    import { mediaLibrary } from "../../../store"
 
     export let card: Card
     export let properties: string[][]
@@ -24,11 +23,7 @@
 </script>
 
 <div class="card">
-    <img
+    <img src="{apiBaseURL}page/{pageId}/{card.image.src}" alt="card" />
-        src="{apiBaseURL}medialib/{card.image}/{$mediaLibrary?.[card?.image]?.file?.src}"
-        alt="{$mediaLibrary[card?.image]?.alt || ''}"
-        title="{$mediaLibrary[card?.image]?.title || ''}"
-    />
 
     <div class="content">
         <div
@@ -164,8 +159,8 @@
                                 height: 1.8vw;
                                 max-height: 25px;
                                 border-radius: 15px;
-                                border: 2px solid #6b6868;
+                                border: 2px solid #4f4f4f;
-                                color: #6b6868;
+                                color: #4f4f4f;
                                 background-color: @bg-color-secondary;
                                 display: flex;
                                 justify-content: center;

frontend/src/lib/components/widgets/Worldcard/worldcard.svelte

@@ -2,7 +2,7 @@
     import Card from "./card.svelte"
     import Selectbox from "./selectbox.svelte"
 
-    export let worldCard: WorldCard
+    export let col: Column
     export let pageId: string
 
     let availableProperties = [
@@ -38,9 +38,9 @@
 <div style="display: flex; flex-direction: column; width: 100%; align-items: center;">
     <div class="worldcard">
         <div class="worldcard">
-            {#each worldCard?.row as row}
+            {#each col.worldCard.row as row}
                 <div class="wc-row">
-                    {#each row?.cards as card}
+                    {#each row.cards as card}
                         <Card
                             card="{card}"
                             properties="{availableProperties}"

frontend/src/lib/components/widgets/boxlist.svelte

@@ -1,20 +1,20 @@
 <script lang="ts">
-    export let persons: Page[]
+    export let col: Column
-    let boxes = persons.map((p) => p.personPreview.name)
+
+    // A function to compare first names and sort the array
     const sortByFirstName = (a, b) => {
-        const nameA = a?.split(" ")[0] // Extracts the first name from "First Last"
+        const nameA = a.name.split(" ")[0] // Extracts the first name from "First Last"
-        const nameB = b?.split(" ")[0]
+        const nameB = b.name.split(" ")[0]
-        console.log("nameA", nameA, "nameB", nameB, "comp", nameA?.localeCompare(nameB))
+        return nameA.localeCompare(nameB)
-        return nameA?.localeCompare(nameB)
     }
-    boxes = boxes.sort(sortByFirstName)
+
-    $: console.log(boxes, "boxes", persons)
+    col.boxList.boxes.sort(sortByFirstName) // Sorts the array in place
 </script>
 
 <div class="boxList">
-    {#each boxes as name}
+    {#each col.boxList.boxes as name}
         <div class="box">
-            {name}
+            {name.name}
         </div>
     {/each}
 </div>
@@ -28,7 +28,7 @@
         gap: 20px;
         .box {
             padding: 5px 10px;
-            background-color: @signal-color;
+            background-color: @bg-color-secondary;
             color: @font-color-secondary;
             font-weight: bold;
         }

frontend/src/lib/components/widgets/events.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">
     import { apiBaseURL } from "../../../config"
-    import { mediaLibrary } from "../../store"
 
     export let col: Column
     export let pageId: string
@@ -45,12 +44,7 @@
             </div>
             <div class="details">
                 <em>{nE.title}</em>
-                <a
+                <a href="{apiBaseURL}page/{pageId}/{nE.file.src}" style="text-decoration: none;" download="{apiBaseURL}page/{pageId}/{nE.file.src}">
-                    href="{apiBaseURL}medialib/{nE.file}/{$mediaLibrary?.[nE?.file]?.file?.src}"
-                    style="text-decoration: none;"
-                    download="{apiBaseURL}medialib/{nE.file}/{$mediaLibrary?.[nE?.file]?.file?.src}"
-                    
-                >
                     <button class="more">mehr</button></a
                 >
             </div>

frontend/src/lib/components/widgets/extendableBox.svelte

@@ -2,38 +2,39 @@
     import { onMount } from "svelte"
     import { openExtendableNr } from "../../store"
 
-    export let pages: Page[]
+    export let col: Column
-    export let opened = ""
+    export let opened = -1
-    let jobOffers = pages.map((p) => p.jobOffer)
+
     onMount(() => {
-        if (typeof window !== "undefined") {
+        if (!isNaN($openExtendableNr) && $openExtendableNr !== -1) {
-            opened = location.search.split("=").at(-1)
+            opened = $openExtendableNr
+            $openExtendableNr = -1
         }
     })
 </script>
 
 <div class="boxes">
-    {#each jobOffers as box, i}
+    {#each col.extendableBoxes as box, i}
-        <div class="box" class:opened="{pages[i].id == opened}">
+        <div class="box" class:opened="{i == opened}">
             <div
                 class="upper"
                 on:keydown
                 on:click="{() => {
-                    if (opened == pages[i].id) opened = ''
+                    if (opened == i) opened = -1
-                    else opened = pages[i].id
+                    else opened = i
                 }}"
             >
                 <h4>
                     {box.title}
                 </h4>
                 <div>
-                    {#if pages[i].id !== opened}<img src="/media/down.svg" alt="arrow" />{:else}<img
+                    {#if i !== opened}<img src="/media/down.svg" alt="arrow" />{:else}<img
                             src="/media/up.svg"
                             alt="arrow"
                         />{/if}
                 </div>
             </div>
-            <div class="content" class:closed="{pages[i].id !== opened}">
+            <div class="content" class:closed="{i !== opened}">
                 {@html box.text}
                 {#if box.emailButton}
                     <a
@@ -51,19 +52,19 @@
 
 <style lang="less">
     @import "../../assets/css/main.less";
+    button {
+        margin-top: 20px;
+        background-color: @bg-color-secondary;
+        color: @font-color-secondary;
+        border: 2px solid @bg-color-secondary;
+        padding: 2px 15px;
+        font-weight: bold;
+    }
 
     .boxes {
         display: flex;
         flex-direction: column;
         font-family: "Libre Franklin", "sans-serif";
-        button {
-            margin-top: 20px;
-            background-color: @signal-color;
-            color: @font-color-secondary;
-            border: 2px solid @signal-color;
-            padding: 2px 15px;
-            font-weight: bold;
-        }
         .box {
             border-bottom: 2px dotted @bg-color-secondary;
             display: flex;
@@ -87,13 +88,9 @@
                 justify-content: space-between;
             }
             .content {
-                max-height: 3000px;
+                max-height: 1000px;
                 overflow: hidden;
                 transition: max-height 1s ease-in;
-                ul {
-                    padding-left: 20px;
-                    list-style-type: disc;
-                }
 
                 &.closed {
                     max-height: 0px;

frontend/src/lib/components/widgets/iconBlock.svelte

@@ -1,20 +1,15 @@
 <script lang="ts">
     import { apiBaseURL } from "../../../config"
-    import { mediaLibrary } from "../../store"
 
     export let pageId: string
     export let col: Column
-    console.log("icons:", col.iconBlocks, $mediaLibrary, $mediaLibrary[col.iconBlocks[0].icon])
 </script>
 
 <div class="iconBlock">
+
     {#each col.iconBlocks as icon}
         <div class="icon">
-            <img
+            <img src="{`${apiBaseURL}page/${pageId}/${icon.icon?.src}`}" alt="img" />
-                alt="{$mediaLibrary[icon.icon]?.alt || ''}"
-                title="{$mediaLibrary[icon.icon]?.title || ''}"
-                src="{`${apiBaseURL}medialib/${icon.icon}/${$mediaLibrary?.[icon?.icon]?.file?.src}`}"
-            />
             <div class="text">
                 <em>{icon.bigText}</em>
                 <p>{icon.smallText}</p>

frontend/src/lib/components/widgets/iconCycleBox.svelte

@@ -1,27 +1,24 @@
 <script lang="ts">
     import { apiBaseURL } from "../../../config"
-    import { mediaLibrary } from "../../store"
+    export let col: Column
-    export let iconCycleSquare: IconCycleSquare
     export let pageId: string
-    console.log("YEY")
+
     let active = -1
-    if (typeof window !== "undefined") {
+    setInterval(() => {
-        setInterval(() => {
+        active += 1
-            active += 1
+        if (active == col.iconCycleSquare.boxes.length) active = 0
-            if (active == iconCycleSquare.boxes.length) active = 0
+    }, 1250)
-        }, 1250)
-    }
 </script>
 
 <div class="iconCycleSquares">
-    {#each iconCycleSquare?.boxes as box, i}
+    {#each col?.iconCycleSquare?.boxes as box, i}
         <div class="box" id="box{i}" class:active="{i == active}">
             <div class="content">
                 <div class="icon">
                     <svg
-                        stroke="{i == active ? '#5b6e98' : 'white'}"
+                        stroke="{i == active ? 'black' : 'white'}"
-                        fill="{i == active ? '#5b6e98' : 'white'}"
+                        fill="{i == active ? 'black' : 'white'}"
-                        data-src="{apiBaseURL}medialib/{box?.icon}/{$mediaLibrary?.[box?.icon]?.file?.src}"></svg>
+                        data-src="{apiBaseURL}page/{pageId}/{box.icon?.src}"></svg>
                 </div>
                 <div class="text">
                     {box.text}
@@ -45,8 +42,8 @@
             font-size: 1rem;
         }
         .box {
-            border: 4px solid @signal-color;
+            border: 4px solid @bg-color-secondary;
-            background-color: @signal-color;
+            background-color: @bg-color-secondary;
             display: flex;
             align-items: center;
             justify-content: center;
@@ -54,7 +51,7 @@
             padding: 10px;
             &.active {
                 background-color: @bg-color;
-                color: #5b6e98;
+                color: @font-color;
             }
             aspect-ratio: 1/1;
             width: calc((100% / 2) - 10px);

frontend/src/lib/components/widgets/iconCycleCircle.svelte

@@ -1,13 +1,11 @@
 <script lang="ts">
     import { apiBaseURL } from "../../../config"
     import { onMount } from "svelte"
-    import { mediaLibrary } from "../../store"
-
-    export let iconCycleCircle: IconCycleCircle
 
+    export let col: Column
     export let pageId: string
 
-    let count = iconCycleCircle.boxes.length // The number of surrounding circles.
+    let count = col.iconCycleCircle.boxes.length // The number of surrounding circles.
     let angleStep = 360 / count
     let radius = 310
 
@@ -26,18 +24,17 @@
         circles = circles
     })
     let focused = -1
-    if (typeof window !== "undefined") {
+    setInterval(() => {
-        setInterval(() => {
+        focused += 1
-            focused += 1
+        if (focused == count) focused = 0
-            if (focused == count) focused = 0
+        const svgObject = document.getElementById("mySvgObject" + focused)
-        }, 1000)
+    }, 1000)
-    }
 </script>
 
 <div class="container">
     <div class="main-circle">
         <div class="content">
-            {iconCycleCircle.innerText}
+            {col.iconCycleCircle.innerText}
         </div>
         {#each circles as { x, y, rotation }, i}
             <div
@@ -53,14 +50,12 @@
                     <div class="icon">
                         <svg
                             id="mySvgObject{i}"
-                            stroke="{i == focused ? 'white' : '#5b6e98'}"
+                            stroke="{i == focused ? 'white' : 'black'}"
-                            fill="{i == focused ? 'white' : '#5b6e98'}"
+                            fill="{i == focused ? 'white' : 'black'}"
-                            data-src="{apiBaseURL}medialib/{iconCycleCircle?.boxes[i]?.icon}/{$mediaLibrary[
+                            data-src="{apiBaseURL}page/{pageId}/{col.iconCycleCircle?.boxes[i]?.icon?.src}"></svg>
-                                iconCycleCircle?.boxes[i]?.icon
-                            ]?.file?.src}"></svg>
                     </div>
                     <div class="text" style="text-align: center;">
-                        {@html iconCycleCircle?.boxes[i]?.text}
+                        {@html col.iconCycleCircle?.boxes[i]?.text}
                     </div>
                 </div>
             </div>
@@ -112,7 +107,7 @@
             width: 180px;
             height: 180px;
             margin: auto;
-            background: @signal-color;
+            background: rgb(0, 0, 0);
             border-radius: 50%;
             & > .content {
                 font-weight: bold;
@@ -131,8 +126,8 @@
                 width: 180px;
                 overflow: hidden;
                 height: 180px;
-                background: @signal-color;
+                background: rgba(255, 255, 255, 0);
-                border: 4px solid @signal-color;
+                border: 4px solid @bg-color-secondary;
                 z-index: 100;
                 transform-origin: center;
                 border-radius: 50%;
@@ -183,7 +178,7 @@
                     &::before {
                         content: "";
                         position: absolute;
-                        background: @signal-color;
+                        background: rgb(0, 0, 0);
                         border-radius: 50%;
                         top: -50%;
                         left: 0;
@@ -195,13 +190,13 @@
                 &.focused {
                     background: @bg-color-secondary !important;
                     .number {
-                        color: @signal-color !important;
+                        color: @font-color !important;
                     }
                     .content {
                         color: @font-color-secondary !important;
                     }
                     .half {
-                        background: @signal-color !important;
+                        background: @bg-color-secondary !important;
                         &::before {
                             background: @bg-color !important;
                         }

frontend/src/lib/components/widgets/image.svelte

@@ -1,28 +1,19 @@
 <script lang="ts">
     import { apiBaseURL } from "../../../config"
-    import { mediaLibrary } from "../../store"
+    export let image: FileField
-    export let image: string
     export let pageId: string
-    export let col: { contentType: "image"; image: string; icons: { icon: string; link: string }[] }
+    export let col: Column
 </script>
 
 <div class="image-container">
-    <img
+    <img src="{`${apiBaseURL}page/${pageId}/${image?.src}`}" alt="img" />
-        src="{`${apiBaseURL}medialib/${image}/${$mediaLibrary[image]?.file?.src}`}"
-        alt="{$mediaLibrary[image]?.alt || ''}"
-        title="{$mediaLibrary[image]?.title || ''}"
-    />
 </div>
 {#if col && col.icons}
     <div class="icons">
         {#each col.icons as icon}
             <div class="icon">
                 <a href="{icon.link}" style="text-decoration: none;" target="_blank">
-                    <img
+                    <img src="{`${apiBaseURL}page/${pageId}/${icon.icon?.src}`}" alt="img" />
-                        src="{`${apiBaseURL}medialib/${icon.icon}/${$mediaLibrary[icon.icon]?.file?.src}`}"
-                        alt="{$mediaLibrary[icon.icon]?.alt || ''}"
-                        title="{$mediaLibrary[icon.icon]?.title || ''}"
-                    />
                 </a>
             </div>
         {/each}
@@ -48,8 +39,5 @@
         display: flex;
         justify-content: flex-start;
         gap: 20px;
-        img {
-            width: 48px;
-        }
     }
 </style>

frontend/src/lib/components/widgets/infoBoard.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">
     import { apiBaseURL } from "../../../config"
-    import { mediaLibrary } from "../../store"
 
     export let col: Column
     export let pageId: string
@@ -9,11 +8,7 @@
 <div class="infoBoard">
     <div class="header">
         <div class="icon">
-            <img
+            <img src="{`${apiBaseURL}page/${pageId}/${col.infoBoard.icon?.src}`}" alt="img" />
-                src="{`${apiBaseURL}medialib/${col.infoBoard.icon}/${$mediaLibrary[col.infoBoard.icon]?.file?.src}`}"
-                alt="{$mediaLibrary[col.infoBoard.icon]?.alt || ''}"
-                title="{$mediaLibrary[col.infoBoard.icon]?.title || ''}"
-            />
         </div>
         <div class="title">
             {col.infoBoard.title}

frontend/src/lib/components/widgets/moreBtn.svelte

@@ -10,7 +10,7 @@
 <style lang="less">
     @import "../../assets/css/main.less";
     .more {
-        background-color: @signal-color;
+        background-color: @bg-color-secondary;
         color: @font-color-secondary;
         border: none;
         height: 36px;
@@ -20,9 +20,5 @@
     }
     .bright {
         border: 2px solid @bg-color;
-        background-color: @bg-color-secondary;
-        &:hover {
-            background-color: @signal-color;
-        }
     }
 </style>

frontend/src/lib/components/widgets/nestedCard.svelte

@@ -54,7 +54,7 @@
                 height: 100px;
                 width: 365px;
                 z-index: 9;
-                background-color: @signal-color;
+                background-color: @bg-color-secondary;
             }
             .description {
                 position: relative;

frontend/src/lib/components/widgets/pageLinkBlocks.svelte

@@ -1,36 +1,22 @@
 <script lang="ts">
     import { navigate } from "svelte-routing/src/history"
-    import { openExtendableNr, rerender, scrollToRowNr } from "../../store"
+    import { openExtendableNr, pages, rerender, scrollToRowNr } from "../../store"
-    export let pages: Page[]
+    export let col: Column
-    export let pageReference: string
-    let jobOffers = pages.map((p) => p.jobOffer)
     let focused = -1
 </script>
 
 <div class="link-container">
-    {#each jobOffers as job, i}
+    {#each col.pageLinkBlocks as link, i}
-        {#if i < 3}
+        {#if isNaN(link.extendableRowNr)}
             <button
-                class="row-ref fill"
+                class="page-ref"
                 on:click="{() => {
                     $rerender = $rerender + 1
-                    navigate(pageReference + '?elem=' + pages[i].id)
+                    $scrollToRowNr = link.rowNr
-                }}"
+                    navigate(Object.values($pages)?.find((o) => o.id == link.page)?.path || '/')
-                on:mouseenter="{() => {
-                    focused = i
-                }}"
-                on:mouseleave="{() => {
-                    focused = -1
                 }}"
             >
-                <div>
+                {link.name}
-                    {job.title}
-                </div>
-                <svg
-                    data-src="/media/arrow-r.svg"
-                    stroke="{i == focused ? '#fff' : '#343a40'}"
-                    fill="{i == focused ? '#fff' : '#343a40'}"
-                    style="z-index: 9999; position: relative;"></svg>
             </button>
         {:else}
             <button
@@ -40,13 +26,22 @@
                 on:mouseleave="{() => {
                     focused = -1
                 }}"
+                class="row-ref fill"
                 on:click="{() => {
                     $rerender = $rerender + 1
-                    navigate(pageReference)
+                    $scrollToRowNr = link.rowNr
+                    $openExtendableNr = link.extendableRowNr
+                    navigate(Object.values($pages)?.find((o) => o.id == link.page)?.path || '/')
                 }}"
-                class="page-ref"
             >
-                <div>Mehr offene Stellen</div>
+                <div>
+                    {link.name}
+                </div>
+                <svg
+                    data-src="/media/arrow-r.svg"
+                    stroke="{i == focused ? '#fff' : 'black'}"
+                    fill="{i == focused ? '#fff' : 'black'}"
+                    style="z-index: 9999; position: relative;"></svg>
             </button>
         {/if}
     {/each}
@@ -83,15 +78,12 @@
                 width: 20px;
                 height: auto;
             }
-            &:hover {
-                color: white !important;
-            }
         }
 
         .page-ref {
-            background-color: @signal-color;
+            background-color: @bg-color-secondary;
             color: @font-color-secondary;
-            border: 2px solid @signal-color;
+            border: 2px solid @bg-color-secondary;
         }
     }
 </style>

frontend/src/lib/components/widgets/persons.svelte

@@ -1,48 +1,39 @@
 <script lang="ts">
     import { apiBaseURL } from "../../../config"
-    import { mediaLibrary, pages, rerender } from "../../store"
+    import { pages, rerender } from "../../store"
     import { navigate } from "svelte-routing/src/history"
-
     export let pageId: string
-    export let persons: Page[]
+    export let col: Column
-    persons = persons.sort((a, b) => a.sort - b.sort)
-
     let hover = -1
 </script>
 
 <div class="persons">
-    {#each persons as p, i}
+    {#each col.personPreview as pp, i}
         <button
             class="person"
             on:click="{() => {
                 $rerender = $rerender + 1
-                navigate(p.path)
+                navigate(Object.values($pages)?.find((o) => o.id == pp.link)?.path || '/')
             }}"
         >
             <div class="image" on:mouseover="{() => (hover = i)}" on:focus on:blur on:mouseout="{() => (hover = -1)}">
                 <!-- Initial Image -->
                 <img
                     class="initial"
-                    src="{`${apiBaseURL}medialib/${p?.personPreview?.initialImage}/${
+                    src="{`${apiBaseURL}page/${pageId}/${pp.initialImage?.src}`}"
-                        $mediaLibrary[p?.personPreview?.initialImage]?.file?.src
+                    alt="img"
-                    }`}"
                     style="opacity: {hover == i ? 0 : 1}"
-                    alt="{$mediaLibrary[p?.personPreview?.initialImage]?.alt || ''}"
-                    title="{$mediaLibrary[p?.personPreview?.initialImage]?.title || ''}"
                 />
                 <!-- Hover Image -->
                 <img
                     class="hover"
-                    src="{`${apiBaseURL}medialib/${p?.personPreview?.hoverImage}/${
+                    src="{`${apiBaseURL}page/${pageId}/${pp.hoverImage?.src}`}"
-                        $mediaLibrary[p?.personPreview?.hoverImage]?.file?.src
+                    alt="img"
-                    }`}"
                     style="opacity: {hover == i ? 1 : 0}"
-                    alt="{$mediaLibrary[p?.personPreview?.hoverImage]?.alt || ''}"
-                    title="{$mediaLibrary[p?.personPreview?.hoverImage]?.title || ''}"
                 />
             </div>
             <div class="text">
-                {p?.personPreview?.name}
+                {pp.name}
             </div>
         </button>
     {/each}
@@ -77,13 +68,14 @@
                     position: absolute;
                     top: 0;
                     left: 0;
-                    transition: opacity 0.3s;
+                    transition: opacity 0.3s; 
                 }
             }
             .text {
                 width: 100%;
-                background-color: @signal-color;
+                background-color: @bg-color-secondary;
                 color: @font-color-secondary;
+                border: 2px solid @bg-color-secondary;
                 padding: 2px 15px;
                 font-weight: bold;
             }

frontend/src/lib/components/widgets/publications.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">
     import { apiBaseURL } from "../../../config"
-    import { mediaLibrary } from "../../store"
 
     export let col: Column
     export let pageId: string
@@ -21,8 +20,8 @@
                 <div class="content">{@html publication.content}</div>
                 <div class="download">
                     <a
-                        href="{apiBaseURL}medialib/{publication.file}/{$mediaLibrary[publication.file]?.file.src}"
+                        href="{apiBaseURL}page/{pageId}/{publication.file.src}"
-                        download="{apiBaseURL}medialib/{publication.file}/{$mediaLibrary[publication.file]?.file.src}"
+                        download="{apiBaseURL}page/{pageId}/{publication.file.src}"
                     >
                         <button class="download-button">zur Publikation</button>
                     </a>

frontend/src/lib/components/widgets/scrollDown.svelte

@@ -10,40 +10,30 @@
     }
 
     const jumpDown = () => {
-        if (typeof window !== "undefined") {
+        // Jump down by 100vh
-            // Jump down by 100vh
+        window.scrollTo({ top: window.innerHeight, behavior: "smooth" })
-            window.scrollTo({ top: window.innerHeight, behavior: "smooth" })
-        }
     }
 
     onMount(() => {
-        if (typeof window !== "undefined") {
+        // Attach scroll event listener when component is mounted
-            // Attach scroll event listener when component is mounted
+        window.addEventListener("scroll", checkScroll)
-            window.addEventListener("scroll", checkScroll)
-        }
     })
 
     onDestroy(() => {
-        if (typeof window !== "undefined") {
+        // Remove scroll event listener when component is destroyed
-            // Remove scroll event listener when component is destroyed
+        window.removeEventListener("scroll", checkScroll)
-            window.removeEventListener("scroll", checkScroll)
-        }
     })
     let force = true
-    if (typeof window !== "undefined") {
+    setInterval(() => {
-        setInterval(() => {
+        if (location.pathname != "/") {
+            force = false
+        } else force = true
+    }, 1000)
+    $: {
+        if ($rerender) {
             if (location.pathname != "/") {
                 force = false
             } else force = true
-        }, 1000)
-    }
-    $: {
-        if (typeof window !== "undefined") {
-            if ($rerender) {
-                if (location.pathname != "/") {
-                    force = false
-                } else force = true
-            }
         }
     }
 </script>

frontend/src/lib/components/widgets/scrollTop.svelte

@@ -9,24 +9,18 @@
     }
 
     const scrollToTop = () => {
-        if (typeof window !== "undefined") {
+        // Scroll smoothly to the top
-            // Scroll smoothly to the top
+        window.scrollTo({ top: 0, behavior: "smooth" })
-            window.scrollTo({ top: 0, behavior: "smooth" })
-        }
     }
 
     onMount(() => {
-        if (typeof window !== "undefined") {
+        // Attach scroll event listener when component is mounted
-            // Attach scroll event listener when component is mounted
+        window.addEventListener("scroll", checkScroll)
-            window.addEventListener("scroll", checkScroll)
-        }
     })
 
     onDestroy(() => {
-        if (typeof window !== "undefined") {
+        // Remove scroll event listener when component is destroyed
-            // Remove scroll event listener when component is destroyed
+        window.removeEventListener("scroll", checkScroll)
-            window.removeEventListener("scroll", checkScroll)
-        }
     })
 </script>
 

frontend/src/lib/components/widgets/topDown.svelte

@@ -31,7 +31,7 @@
                 min-width: 60px;
                 min-height: 100px;
                 padding: 10px;
-                background-color: @signal-color;
+                background-color: @bg-color-secondary;
                 color: @font-color-secondary;
                 font-family: "LibreCaslonText";
                 font-size: 1.7rem;

frontend/src/lib/functions/loadLibrary.ts

@@ -1,6 +0,0 @@
-import { api } from "../../api"
-
-export async function loadLibrary(): Promise<MediaLibrary[]> {
-    let lib = await api<MediaLibrary[]>("medialib", {})
-    return lib.data
-}

frontend/src/lib/functions/loadModules.ts

@@ -1,6 +0,0 @@
-import { api } from "../../api"
-
-export async function loadModules(): Promise<Module[]> {
-    let module = await api<Module[]>("module", {})
-    return module.data
-}

frontend/src/lib/functions/loadNavigation.ts

@@ -2,6 +2,5 @@ import { api } from "../../api"
 
 export async function loadNavigation(): Promise<Navigation[]> {
     let nav = await api<Navigation[]>("navigation", {})
-    console.log("NAV:", nav)
     return nav.data
 }

frontend/src/lib/store.ts

@@ -12,10 +12,6 @@ export const location = writable(initLoc)
 
 export let navigation = writable<Navigation>()
 export let pages = writable<Pages>({})
-export let team = writable<Pages>({})
-export let jobOffers = writable<Pages>({})
-export let modules = writable<{ [id: string]: Module }>({})
-export let mediaLibrary = writable<{ [id: string]: MediaLibrary }>({})
 export let serviceNavigation = writable<Navigation>()
 export let rerender = writable(0)
 export let scrollToRowNr = writable(-1)

package.json

@@ -9,10 +9,8 @@
     "scripts": {
         "validate": "svelte-check && tsc --noEmit",
         "dev": "node scripts/esbuild-wrapper.js watch",
-        "start": "node scripts/esbuild-wrapper.js start",
+        "start": "NAMESPACE=renz_shop node scripts/esbuild-wrapper.js start",
-        "start:ssr": "SSR=1 node scripts/esbuild-wrapper.js start",
         "build": "node scripts/esbuild-wrapper.js build",
-        "build:admin": "node scripts/esbuild-wrapper.js build esbuild.config.admin.js",
         "build:legacy": "node scripts/esbuild-wrapper.js build esbuild.config.legacy.js && babel _temp/index.js -o _temp/index.babeled.js && esbuild _temp/index.babeled.js --outfile=frontend/dist/index.es5.js --target=es5 --bundle --minify --sourcemap",
         "build:server": "node scripts/esbuild-wrapper.js build esbuild.config.server.js && babel _temp/app.server.js -o _temp/app.server.babeled.js && esbuild _temp/app.server.babeled.js --outfile=api/hooks/lib/app.server.js --target=es5 --bundle --sourcemap --platform=node",
         "build:test": "node scripts/esbuild-wrapper.js build esbuild.config.test.js && babel --config-file ./babel.config.test.json _temp/hook.test.js -o _temp/hook.test.babeled.js && esbuild _temp/hook.test.babeled.js --outfile=api/hooks/lib/hook.test.js --target=es5 --bundle --sourcemap --platform=node",
@@ -54,7 +52,6 @@
         "autoprefixer": "^10.4.14",
         "core-js": "3.30.1",
         "cssnano": "^6.0.0",
-        "external-svg-loader": "^1.6.10",
         "postcss-import": "^15.1.0",
         "postcss-load-config": "^4.0.1",
         "postcss-nested": "^6.0.1",