Commit 37a49d32 authored by santiago duque's avatar santiago duque

added my own plugins and blueprints for structure, also files bp's and tabs, etc

parent a0b11aa3
...@@ -8,6 +8,8 @@ fields: ...@@ -8,6 +8,8 @@ fields:
type: files type: files
max: 1 max: 1
required: true required: true
uploads: image
query: page.images
text: text:
label: Scrolling Text label: Scrolling Text
type: writer type: writer
...@@ -14,3 +14,5 @@ fields: ...@@ -14,3 +14,5 @@ fields:
label: Background Image label: Background Image
type: files type: files
max: 1 max: 1
uploads: image
query: page.images
title: Default Image
accept:
mime: image/*
type: image
maxsize: 6000000
fields:
alt:
label: Alt Text
help: Erscheint wenn das Bild nicht geladen werden kann und/oder wird von Screen-Readern vorgelesen.
type: text
width: 1/2
caption:
help: Bildlegende
label: Caption
type: textarea
width: 1/2
title: Dokument
accept:
type: document, archive
maxsize: 15000000
fields:
infocomplete:
label: External Link
type: info
text: '{{file.previewUrl}}'
inforelative:
label: Local Link
type: info
text: '/{{file.id}}'
\ No newline at end of file
title: Bild
accept:
mime: image/*
type: image
#extension: jpg, png
maxsize: 8000000
create:
width: 3000
height: 3000
crop: false
fields:
alt:
label: Alternativer Text
type: text
width: 1/2
help: Erscheint wenn das Bild nicht geladen werden kann und/oder wird von Screen-Readern vorgelesen.
caption:
label: Caption
help: Bildlegende
type: writer
inline: true
width: 1/1
marks:
- bold
- italic
- underline
- strike
- clear
title: MP3
accept:
extension: mp3
maxsize: 10000000
fields:
title:
type: text
label: Beschriftung
subtitle:
type: text
label: Subheadline
description:
type: writer
icon: text
inline: true
label: Beschreibung
marks:
- bold
- italic
- underline
- strike
- clear
transcript:
type: writer
marks:
- bold
- italic
- underline
- strike
- clear
icon: text
label: Transkript
# controls:
# type: toggle
# text: Controls zeigen?
# width: 1/2
# default: true
# autoplay:
# type: toggle
# text: Autoplay
# width: 1/2
# default: false
title: Bild (Site)
accept:
mime: image/*
type: image
#extension: jpg, png
maxsize: 8000000
create:
width: 2000
height: 1440
crop: false
fields:
alt:
label: Alternative Text
type: text
width: 1/2
help: Erscheint wenn das Bild nicht geladen werden kann und/oder wird von Screen-Readern vorgelesen.
caption:
label: Caption
help: Bildlegende
type: writer
inline: true
width: 1/1
marks:
- bold
- italic
- underline
- strike
- clear
\ No newline at end of file
title: Video
accept:
extension: mp4
type: video
maxsize: 32000000
fields:
alt:
label: Alt Text
help: Erscheint wenn das Video nicht geladen werden kann und/oder wird von Screen-Readern vorgelesen.
type: text
width: 1/2
caption:
label: Caption
help: Reguläre, visuelle Videolegende
type: writer
marks:
- bold
- italic
- underline
- strike
- clear
inline: true
width: 1/2
poster:
label: field.blocks.video.poster
type: files
translate: false
query: file.parent.getmixedimages
multiple: false
image:
back: black
uploads: image
description:
label: Beschreibung (für Accessibility)
type: writer
marks:
- bold
- italic
- underline
- strike
- clear
inline: true
help: Eine Art Zusammenfassung. Wird vom ScreenReader erkannt und vorgelesen.
autoplay:
label: field.blocks.video.autoplay
type: toggle
width: 1/3
translate: false
muted:
label: field.blocks.video.muted
type: toggle
width: 1/3
default: true
translate: false
loop:
label: field.blocks.video.loop
type: toggle
width: 1/3
translate: false
controls:
label: field.blocks.video.controls
type: toggle
width: 1/3
default: true
translate: false
preload:
label: field.blocks.video.preload
type: select
width: 2/3
default: auto
translate: false
options:
- auto
- metadata
- none
h_a11yline:
type: line
h_a11yheader:
type: headline
label: Extra Accessibility-Dateien für Player
# vtt
vtt_description_de:
label: Audiobeschreibung (de)
type: files
multiple: false
max: 1
help: Für **blinde** Menschen. Wird vom ScreenReader automatisch gesehen (Audio-Beschreibung synchron zum Video).
uploads: document
query: file.parent.files.filterBy('template', 'document')
width: 1/2
translate: false
vtt_description_en:
label: Audiobeschreibung (en)
type: files
multiple: false
max: 1
help: Für **blinde** Menschen. Wird vom ScreenReader automatisch gesehen (Audio-Beschreibung synchron zum Video).
uploads: document
query: file.parent.files.filterBy('template', 'document')
width: 1/2
translate: false
# vtt_description_lang:
# label: Sprache - Beschreibung in Video
# type: select
# options:
# - de
# - en
vtt_description_label_de:
label: Label im Video-Player (de) - Audiobeschreibung in Video
type: text
width: 1/2
translate: false
vtt_description_label_en:
label: Label im Video-Player (en) - Audiobeschreibung in Video
type: text
width: 1/2
translate: false
vtt_line_1:
type: line
vtt_captions_de:
label: Untertitel (de)
type: files
multiple: false
max: 1
help: Für **taube** Menschen. Wird im Videoplayer automatisch geladen.
uploads: document
query: file.parent.files.filterBy('template', 'document')
width: 1/2
translate: false
vtt_captions_en:
label: Untertitel (en)
type: files
multiple: false
max: 1
help: Für **taube** Menschen. Wird im Videoplayer automatisch geladen.
uploads: document
query: file.parent.files.filterBy('template', 'document')
width: 1/2
translate: false
# vtt_captions_lang:
# label: Sprache - Captions
# type: select
# options:
# - de
# - en
vtt_captions_label_de:
label: Label im Video-Player (de) - Captions
type: text
width: 1/2
translate: false
vtt_captions_label_en:
label: Label im Video-Player (en) - Captions
type: text
width: 1/2
translate: false
# vtt_line_2:
# type: line
# vtt_subtitles:
# label: Untertitel
# type: files
# multiple: false
# max: 1
# help: Für Nicht-Muttersprachler. Nur 1 Track ist hier erlaubt, es wird empfohlen Englisch zu verwenden. Wird im Videoplayer automatisch geladen (Untertitel).
# uploads: document
# query: file.parent.files.filterBy('template', 'document')
# vtt_subtitles_lang:
# label: Sprache - Untertitel
# type: text
# vtt_subtitles_label:
# label: Titel - Untertitel
# type: text
title: Zip
accept:
extension: zip
maxsize: 32000000
...@@ -3,6 +3,7 @@ title: Chapter ...@@ -3,6 +3,7 @@ title: Chapter
tabs: tabs:
content: content:
label: Content label: Content
icon: document
fields: fields:
part: part:
label: Part label: Part
...@@ -51,7 +52,7 @@ tabs: ...@@ -51,7 +52,7 @@ tabs:
label: Scroll Cue Text label: Scroll Cue Text
type: text type: text
default: Scroll to descend default: Scroll to descend
sections: sections:
label: Chapter Sections label: Chapter Sections
type: blocks type: blocks
...@@ -63,3 +64,8 @@ tabs: ...@@ -63,3 +64,8 @@ tabs:
- pinned-text - pinned-text
- pinned-image - pinned-image
# gallery tab
gallery: tabs/galleryTab
# kirby seo
seo: tabs/seo
type: files
headline: Media library
layout: cards
text: "{{ file.filename }}"
empty: Bitte laden Sie hier Bilder für diese Seite hoch, um sie auf dieser Seite verwenden zu können.
help: max. 8MB
image:
back: white
ratio: 4/3
size: small
\ No newline at end of file
type: files
template: document
headline: Dokumente
layout: list
text: "{{ file.filename }}"
empty: Bitte laden Sie hier Dokumente für diese Seite hoch, um sie auf dieser Seite verwenden zu können.
help: max. 15MB
limit: 6
type: files
template: image
headline: Bilder
layout: cardlets
#info: "{{ file.caption.safeHtml }}"
text: "{{ file.filename }}"
empty: Bitte laden Sie hier Bilder für diese Seite hoch, um sie auf dieser Seite verwenden zu können.
help: max. 8MB – Die lange Seite der Bilder wird auf maximal 3000px automatisch verkleinert.
limit: 18
# image:
# back: white
# ratio: 4/3
# size: small
type: files
template: mp3
headline: Audio
layout: cardlets
text: "{{ file.filename }}"
empty: Bitte laden Sie hier MP3 für diese Seite hoch, um sie auf dieser Seite verwenden zu können.
help: max. 10MB
limit: 18
# image:
# back: white
# ratio: 4/3
# size: small
type: files
template: video
headline: Videos
layout: cardlets
text: "{{ file.filename }}"
empty: Bitte laden Sie hier Videos für diese Seite hoch, um sie auf dieser Seite verwenden zu können.
help: max. 32MB
limit: 18
# image:
# back: white
# ratio: 4/3
# size: small
type: files
template: zip
headline: Zips
layout: list
#info: "{{ file.caption.safeHtml }}"
text: "{{ file.filename }}"
empty: Bitte laden Sie hier ZIP-Dateien für diese Seite hoch, um sie auf dieser Seite verwenden zu können.
help: max. 32MB
limit: 6
# image:
# back: white
# ratio: 4/3
# size: small
label: seo.tabs.seo
icon: search
columns:
headings:
width: 3/4
sections:
headings:
type: heading-structure
information:
width: 1/4
sections:
infoheadings:
type: fields
fields:
infoheadings:
type: info
label: "Zu der Überschriftenstruktur:"
text: Hier können Sie überprüfen, ob die Hierarchie der Headlines dieser Seite richtig strukturiert ist
main:
width: 7/12
fields:
metaGroup: seo/fields/meta-group
ogGroup: seo/fields/og-group
robots: seo/fields/robots
metaInherit:
label: seo.fields.inheritSettings.label
type: multiselect
help: seo.fields.inheritSettings.help
options:
metaTemplate:
"*": seo.fields.metaTitleTemplate.label
metaDescription:
"*": seo.fields.metaDescription.label
ogTemplate:
"*": seo.fields.ogTitleTemplate.label
ogDescription:
"*": seo.fields.ogDescription.label
ogImage:
"*": seo.fields.ogImage.label
cropOgImage:
"*": seo.fields.cropOgImage.label
robots:
"*": seo.fields.robots.label
sidebar:
width: 5/12
sticky: true
sections:
seoPreview:
type: seo-preview
label: Uploads dieser Seite
icon: upload
sections:
imgs:
extends: sections/filesimages
vids:
extends: sections/filesvideos
mp3s:
extends: sections/filessounds
docs:
extends: sections/filesdocs
label: Globale Uploads
icon: upload
sections:
imgs:
extends: sections/filesimages
limit: 50
empty: Bitte laden Sie hier Bilder hoch. Diese können überall verwendet werden.
# vids:
# extends: sections/filesvideos
# empty: Bitte laden Sie hier Videos hoch. Diese können überall verwendet werden.
# mp3s:
# extends: sections/filessounds
# docs:
# extends: sections/filesdocs
extends: seo/page
columns:
sidebar:
width: 1/4
sections:
quickfields:
type: fields
fields:
dividerline:
type: line
headings:
type: heading-structure
name: field.blocks.accordion.name
icon: template
fields:
heading:
label: Section Heading
type: writer
inline: true
marks: false
placeholder: Accordion headline... (optional)
level:
label: field.blocks.heading.level
type: select
empty: false
default: "h2"
width: 1/6
options:
- h1
- h2
- h3
- h4
- h5
- h6
group:
label: Group elements?
type: toggle
default: no
help: If individual, all elements can stay open at the same time.
elements:
label: Elements
type: blocks
fieldsets:
- accordion_element
\ No newline at end of file
name: field.blocks.accordion_element.name
icon: bars
fields:
summary:
label: Button text
type: writer
marks: false
placeholder: Button text...
details:
label: Accordion text
type: writer
placeholder: Enter accordion text...
marks: true
\ No newline at end of file
name: Audio
icon: file-audio
fields:
source:
type: files
label: Datei
query: page.getmixedaudios
uploads: mp3
multiple: false
title:
type: text
label: Beschriftung
subtitle:
type: text
label: Subheadline
description:
type: writer
icon: text
inline: true
label: Beschreibung
marks:
- bold
- italic
- underline
- strike
- clear
transcript:
type: writer
icon: text
label: Transkript
marks:
- bold
- italic
- underline
- strike
- clear
controls:
type: toggle
text: Controls zeigen?
width: 1/2
default: true
autoplay:
type: toggle
text: Autoplay
width: 1/2
default: false
name: field.blocks.button.name
icon: angle-right
fields:
btn_label:
type: text
label:
de: Button Beschriftung
en: Button label
linkage:
type: link
label:
en: Select link ...
de: Link auswählen ...
target:
type: toggle
label:
de: Im neuen Fenster?
en: In new window?
name: field.blocks.card.name
icon: image
fields:
link:
type: url
label: URL
image:
label: Image
type: files
uploads: image
heading:
label: Heading
inline: true
marks: false
type: writer
placeholder: Card headline...
text:
label: Text
type: writer
marks: false
inline: true
placeholder: Text...
\ No newline at end of file
name: Link Element
icon: download
wysiwyg: true
preview: fields
fields:
link:
type: link
label: Link
width: 1/2
options:
- file
- url
- email
- tel
target:
type: toggle
width: 1/4
default: true
label: Im neuen Fenster?
icon:
type: toggles
default: download
columns: 5
width: 1/2
labels: false
# values are lucide values
options:
- value: download
text: Download
icon: download
- value: external-link
text: External
icon: open
- value: phone
text: Telefon
icon: phone
- value: mail
text: Email
icon: email
- value: map-pin
text: Map-Pin
icon: pin
linkText:
type: text
label: Label
width: 1/2
help: Für Accessibility bitte deskriptiv genug sein.
name: Grid box
icon: grid
preview: fields # required
wysiwyg: true # recommended
fields:
headline:
type: writer
placeholder: Headline ...
width: 1/2
text:
type: writer
placeholder: Text ...
width: 1/2
txtcolor:
extends: fields/colorpicker
label: Text colour
translate: true
width: 1/4
bgcolor:
extends: fields/colorpicker
label: BG Colour
translate: true
width: 1/4
align:
label: Text align
type: select
default: "text-left"
translate: true
width: 1/4
options:
"text-left": Left
"text-center": Center
"text-right": Right
"text-justify": Justified-Left
"text-justify-right": Justified-Right
image:
extends: fields/simpleimage
label: BG image
width: 1/4
image_is_fake3d:
label: Has depth-map
type: toggle
image_depthmap:
label: Depth-map image
extends: fields/simpleimage
width: 1/5
whenQuery: image_is_fake3d = true
fake3d_focusx:
label: Focus X
type: range
step: 1
max: 100
min: 0
default: 50
width: 1/5
whenQuery: image_is_fake3d = true
help: Links = 0, Mitte = 50, Rechts = 100
fake3d_focusy:
label: Focus Y
type: range
step: 1
max: 100
min: 0
default: 50
width: 1/5
whenQuery: image_is_fake3d = true
help: Oben = 0, Mitte = 50, Unten = 100
fake3d_threshx:
label: Treshold X
type: range
step: 1
max: 100
min: 1
default: 50
width: 1/5
whenQuery: image_is_fake3d = true
help: Stärke des Effekts in X-Achse
fake3d_threshy:
label: Treshold Y
type: range
step: 1
max: 100
min: 1
default: 50
width: 1/5
whenQuery: image_is_fake3d = true
help: Stärke des Effekts in Y-Achse
imagealpha:
label: Image transparency
type: range
min: 0.05
step: 0.01
max: 1
default: 1
width: 1/4
gradient:
label: Better readability?
type: toggle
width: 1/4
help: Activates BG gradient and text-shadow
ratio:
label: Box ratio
type: select
placeholder: Auto
width: 1/4
options:
1/1: "1:1"
16/9: "16:9"
10/8: "10:8"
21/9: "21:9"
7/5: "7:5"
4/3: "4:3"
5/3: "5:3"
3/2: "3:2"
3/1: "3:1"
mobilecard:
type: toggle
label: As card for mobile?
width: 1/4
cta:
type: toggle
label: Activate CTA?
cta_link:
label: CTA Link
type: object
when:
cta: true
fields:
is_script:
type: toggle
label: Trigger Javascript?
callback:
type: text
label: Callback function name
help: please include brackets ()
when:
is_script: true
link:
type: link
when:
is_script: false
linkText:
type: text
label: Link Text
target:
type: toggle
text: Open in new window?
when:
is_script: false
classes:
type: text
label: CSS Classes
name: field.blocks.heading.name
icon: title
wysiwyg: true
preview: heading
fields:
level:
label: field.blocks.heading.level
type: toggles
empty: false
default: "h2"
labels: false
help: Headline-Level bzw Hierarchie
options:
- value: h1
icon: h1
text: H1
- value: h2
icon: h2
text: H2
- value: h3
icon: h3
text: H3
- value: h4
icon: h4
text: H4
- value: h5
icon: h5
text: H5
- value: h6
icon: h6
text: H6
text:
label: field.blocks.heading.text
type: writer
inline: true
placeholder: field.blocks.heading.placeholder
pre_class:
label: Vordefinierte CSS-Klassen
type: select
width: 1/2
help: Hilfreich um das Aussehen anzupassen ohne die Hierarchien zu brechen.
options:
meta: Meta-Headline
h1: H1 Aussehen
h2: H2 Aussehen
h3: H3 Aussehen
h4: H4 Aussehen
cssclass:
label: CSS-Klasse
width: 1/2
type: text
help: Evtl. extra Klasse (muss i.d.R. vom Designer implementiert werden)
cssid:
label: Element-ID
width: 1/2
type: slug
help: ID des Elements, meistens für Anchor-Links oder bestimmte Funktionalitäten (Letzteres muss i.d.R. vom Designer implementiert werden)
responsive_hide:
label: Responsives Verstecken
help: (optional)
type: select
options:
desktop: Nur auf Desktop anzeigen
mobile: Nur auf Mobile anzeigen
\ No newline at end of file
name: field.blocks.image.name
icon: image
preview: image
fields:
location:
label: field.blocks.image.location
type: radio
columns: 2
default: "kirby"
help: Hochgeladene Bilder aus dieser Website oder externe Bilder per URL
options:
kirby: "{{ t('field.blocks.image.location.internal') }}"
web: "{{ t('field.blocks.image.location.external') }}"
image:
type: files
multiple: false
width: 1/1
query: page.getmixedimages
uploads:
template: image
label: field.blocks.image.name
when:
location: kirby
src:
label: field.blocks.image.url
type: url
when:
location: web
# alt and caption
linetexts:
type: line
alt:
label: field.blocks.image.alt
type: text
icon: title
help: Überschreibt an dieser Stelle den eigentlichen Alt-Text, der in einem Bild definiert ist
caption:
label: field.blocks.image.caption
type: writer
marks:
- bold
- italic
- underline
- strike
- clear
icon: text
inline: true
help: Bildbeschriftung unterhalb des Bildes, falls notwendig
# link
linelink:
type: line
linkactive:
label: Verlinkung aktivieren
type: toggle
link:
label: Link
type: link
icon: text
width: 2/3
help: Optional
when:
linkactive: true
link_desc:
label: Link Beschreibung
type: text
icon: text
width: 2/3
help: Optional für a11y
when:
linkactive: true
target_blank:
label: Link im neuen Fenster öffnen
type: toggle
width: 1/3
whenQuery: link
help: Optional
when:
linkactive: true
# styling
linestyling:
type: line
cssclass:
type: text
label: CSS Klassen
ratio:
label: field.blocks.image.ratio
type: select
placeholder: Auto
width: 1/2
help: Beschränkt den Anzeigebereich des Bildes, z.B. in einem Format 16zu9. Das Bild kann dann entweder in diesem Bereich kleiner dargestellt werden, damit es rein passt, oder mit Hilfe des "Beschneiden"-Schalters abgeschnitten werden
options:
1/1: "1:1"
16/9: "16:9"
10/8: "10:8"
21/9: "21:9"
7/5: "7:5"
4/3: "4:3"
5/3: "5:3"
3/2: "3:2"
3/1: "3:1"
crop:
label: field.blocks.image.crop
type: toggle
width: 1/2
help: Schneidet ein Bild mit einem vorgegebenen Seitenverhältnis
name: field.blocks.mainpage_navitem.name
label: "{{obj.headline}}"
preview: fields # required
wysiwyg: true # recommended
fields:
obj:
label: Information
type: object
fields:
photo:
extends: fields/globalimage
headline:
label: Headline
type: text
btn_label:
label:
de: Button-Beschriftung
en: Button label
type: text
linkedPage:
type: pages
label:
de: Verlinkte Unterseite
en: Linked subpage
query: page.childrenAndDrafts.filterBy('intendedTemplate', 'type-button-based-sub')
name: QR Code
preview: fields # required
wysiwyg: true # recommended
fields:
customurl:
type: text
label: Custom URL
qrcode:
type: qrcode
title: "{{ block.callMethod(customurl) }}"
url: "{{ block.callMethod(customurl) }}"
qrlabel:
type: text
label:
de: Beschriftung
en: Label
name: field.blocks.audio.spacing
icon: divider
fields:
size:
type: select
label: Größe
default: sm
options:
sm: Small
lg: Large
name: Custom Text
icon: text
wysiwyg: true
preview: text
fields:
text:
type: writer
nodes: false
placeholder: field.blocks.text.placeholder
txtcolor:
extends: fields/colors
fontsize:
label: Schrifgröße
type: range
step: 0.25
min: 0.5
max: 3
default: 1
width: 1/3
help: Werte zwischen 0.5 und 3 der normalen Größe sind erlaubt
fontfamily:
label: Schriftart
type: select
width: 1/3
options:
ghibli: Ghibli
poppins: Poppins
fontweight:
label: Dicke
type: select
width: 1/3
options:
normal: Regular
bold: Bold
pre_class:
label: Vordefinierte CSS-Klassen
type: select
width: 1/2
help: Hilfreich um das Aussehen der Textes anzupassen ohne Hierarchien zu brechen.
options:
meta: Meta-Headline (orange)
h1: H1 Aussehen
h2: H2 Aussehen
h3: H3 Aussehen
h4: H4 Aussehen
class:
label: CSS-Klasse
width: 1/2
type: text
help: Evtl. extra Klasse (muss i.d.R. vom Designer implementiert werden)
name: field.blocks.subpage_navitem.name
label: "{{obj.headline}}"
preview: fields # required
wysiwyg: true # recommended
fields:
obj:
label: Information
type: object
fields:
btn_type:
type: select
label:
de: Typ
en: Type
options:
- value: pdf
text: PDF
- value: image
text:
de: Bild
en: Image
- value: video
text: Video
- value : mix
text: Mix
headline:
label: Headline
type: text
subheadline:
label: Subheadline
type: text
btn_label:
label:
de: Button-Beschriftung
en: Button label
type: text
linkedModal:
type: pages
label:
de: Verlinkter Modal
en: Linked modal
query: page.parent.childrenAndDrafts.filterBy('intendedTemplate', 'modal-swiper')
name: Table
icon: menu
preview: table
fields:
tableheading:
type: writer
label: Headline
showheader:
label: Show table header?
type: toggle
#translate: false
help: You can add headings to the columns in your table
text:
- "Off"
- "On"
leftheader:
label: Left column header
type: text
width: 1/2
when:
showheader: true
rightheader:
label: Right column header
type: text
width: 1/2
when:
showheader: true
striped:
label: Striped?
type: toggle
#translate: false
help: Show striped rows
text:
- "Off"
- "On"
rows:
type: structure
columns:
topic:
width: 1/2
description:
width: 1/2
fields:
topic:
type: writer
label: Label
description:
type: writer
label: Description
name: field.blocks.text.name
icon: text
wysiwyg: true
preview: text
fields:
text:
type: writer
nodes: false
placeholder: field.blocks.text.placeholder
pre_class:
label: Vordefinierte CSS-Klassen
type: select
width: 1/2
help: Hilfreich um das Aussehen anzupassen ohne die Hierarchien zu brechen.
options:
meta: Meta-Headline
h1: H1 Aussehen
h2: H2 Aussehen
h3: H3 Aussehen
h4: H4 Aussehen
text--sm: Small Text
cssclass:
label: CSS-Klasse
width: 1/2
type: text
help: Evtl. extra Klasse (muss i.d.R. vom Designer implementiert werden)
responsive_hide:
label: Responsives Verstecken
help: (optional)
type: select
options:
desktop: Nur auf Desktop anzeigen
mobile: Nur auf Mobile anzeigen
name: field.blocks.threedmodel.name
icon: image
fields:
placeholder:
extends: fields/globalimage
label:
de: Platzhalter (Preview-Bild)
en: Placeholder (Preview image)
# type: files
# query: site.find('main-library').files.filterBy('template', 'image')
# multiple: false
# uploads:
# parent: site.find('main-library')
# template: image
threed_model:
type: files
label:
de: 3D Modell
en: 3D model
query: site.find('main-library').files.filterBy('template', 'docs')
multiple: false
uploads:
parent: site.find('main-library')
template: docs
threed_model_light:
type: range
label:
de: Belichtung
en: Exposure
default: 1
min: 0
max: 2
help:
de: Die Belichtung des Modells kann optional hier bearbeitet werden.
en: The exposure of the model can be adjusted here optionally.
ratio:
label: field.blocks.image.ratio
type: select
default: 16/9
width: 1/2
options:
1/1: "1:1"
16/9: "16:9"
9/16: "9:16"
21/9: "21:9"
9/21: "9:21"
4/3: "4:3"
3/4: "3:4"
name: field.blocks.toast.name
icon: alert
wysiwyg: true
fields:
toastType:
label: Toast Type
type: radio
default: text
options:
- text
- bolt
- alert
- neutral
text:
label: Text
type: writer
marks:
- bold
- italic
- underline
- strike
- clear
placeholder: Enter some text…
\ No newline at end of file
name: field.blocks.video.name
icon: video
preview: video
fields:
location:
label: field.blocks.video.location
type: radio
columns: 2
default: "kirby"
options:
kirby: "{{ t('field.blocks.image.location.internal') }}"
web: "{{ t('field.blocks.image.location.external') }}"
url:
label: field.blocks.video.url.label
type: url
placeholder: field.blocks.video.url.placeholder
when:
location: web
video:
label: field.blocks.video.name
type: files
query: page.getmixedvideos
multiple: false
uploads:
template: video
when:
location: kirby
poster:
label: field.blocks.video.poster
type: files
query: page.getmixedimages
multiple: false
image:
back: black
uploads:
template: image
when:
location: kirby
alt:
label: Titel
type: text
inline: true
help: Wird vom ScreenReader vorgelesen.
caption:
label: field.blocks.video.caption
type: writer
inline: true
marks:
- bold
- italic
- underline
- strike
- clear
help: Reguläre, visuelle Videolegende
description:
label: Beschreibung (für Accessibility)
type: writer
marks:
- bold
- italic
- underline
- strike
- clear
inline: true
help: Eine Art Zusammenfassung. Wird vom ScreenReader erkannt und vorgelesen.
autoplay:
label: field.blocks.video.autoplay
type: toggle
width: 1/3
when:
location: kirby
muted:
label: field.blocks.video.muted
type: toggle
width: 1/3
default: true
when:
location: kirby
loop:
label: field.blocks.video.loop
type: toggle
width: 1/3
when:
location: kirby
controls:
label: field.blocks.video.controls
type: toggle
width: 1/3
default: true
when:
location: kirby
preload:
label: field.blocks.video.preload
type: select
width: 2/3
default: auto
options:
- auto
- metadata
- none
when:
location: kirby
# h_a11yline:
# type: line
# when:
# location: kirby
# h_a11yheader:
# type: headline
# label: Extra Accessibility-Dateien für Player
# when:
# location: kirby
# # vtt
# vtt_description:
# label: Audiobeschreibung in Video
# type: files
# multiple: false
# max: 1
# help: Für **blinde** Menschen. Wird im Videoplayer automatisch geladen (Aduio Beschreibung synchron zum Video).
# uploads: document
# query: page.files.filterBy('template', 'document')
# when:
# location: kirby
# vtt_description_lang:
# label: Sprache - Beschreibung in Video
# type: select
# options:
# - de
# - en
# when:
# location: kirby
# vtt_description_label:
# label: Label (im Player) - Audiobeschreibung in Video
# type: text
# when:
# location: kirby
# vtt_line_1:
# type: line
# when:
# location: kirby
# vtt_captions:
# label: Captions
# type: files
# multiple: false
# max: 1
# help: Für **taube** Menschen. Wird im Videoplayer automatisch geladen (Captions bzw. Untertitel).
# uploads: document
# query: page.files.filterBy('template', 'document')
# when:
# location: kirby
# vtt_captions_lang:
# label: Sprache - Captions
# type: select
# options:
# - de
# - en
# when:
# location: kirby
# vtt_captions_label:
# label: Label (im Player) - Captions
# type: text
# when:
# location: kirby
# vtt_line_2:
# type: line
# when:
# location: kirby
# vtt_subtitles:
# label: Untertitel
# type: files
# multiple: false
# max: 1
# help: Für Nicht-Muttersprachler. Nur 1 Track ist hier erlaubt, es wird empfohlen Englisch zu verwenden. Wird im Videoplayer automatisch geladen (Untertitel).
# uploads: document
# query: page.files.filterBy('template', 'document')
# when:
# location: kirby
# vtt_subtitles_lang:
# label: Sprache - Untertitel
# type: text
# when:
# location: kirby
# vtt_subtitles_label:
# label: Titel - Untertitel
# type: text
# when:
# location: kirby
name: field.blocks.videovlite.name
icon: video
fields:
location:
label: Location
type: radio
columns: 2
default: "kirby"
options:
kirby: Upload
web: Web
vimeo: Vimeo
youtube: YouTube
video:
label: field.blocks.videovlite.name
type: files
query: site.find('main-library').files.filterBy('template', 'video')
multiple: false
image:
back: black
when:
location: kirby
uploads:
parent: site.find('main-library')
template: video
vimeoID:
label: Vimeo (ID)
type: text
counter: false
help:
en: Please enter only the video ID
de: Bitte geben Sie nur die Video-ID ein
when:
location: vimeo
youtubeID:
label: YouTube (ID)
type: text
counter: false
help:
en: Please enter only the video ID
de: Bitte geben Sie nur die Video-ID ein
when:
location: youtube
src:
label: URL
type: url
when:
location: web
{
"name": "squareclouds/blocks-factory",
"description": "A custom blocks set",
"type": "kirby-plugin",
"license": "MIT",
"authors": [
{
"name": "Santiago Duque",
"email": "info@squareclouds.de"
}
],
"require": {
"getkirby/composer-installer": "^1.1"
}
}
.k-innerblock-type-toast {
position: relative;
padding: 10px;
border-radius: 5px;
}
.k-innerblock-type-toast.toast-text {
background: #cce3ff;
}
.k-innerblock-type-toast.toast-bolt {
background: #ffd9b3;
}
.k-innerblock-type-toast.toast-alert {
background: #fcc;
}
.k-innerblock-type-toast.toast-neutral {
background: #ccc;
}
.k-block-type-toast-icon {
position: absolute;
top: 10px;
right: 10px;
}
.k-block-type-button input {
border: 2px solid #444;
border-radius: 3rem;
padding: .75rem .75rem;
cursor: pointer;
font: inherit;
text-align: center;
}
.k-block-type-button input:focus {
outline: 0;
border-color: var(--color-focus);
}
details {
margin-left: 1rem;
}
details summary {
margin-left: -1rem;
margin-bottom: .5rem;
font-weight: 600;
}
details summary .k-writer {
display: inline-block;
width: calc(100% - 2rem);
}
.k-block-container:hover .fieldtype {
display: block
}
.k-block-type-card-heading {
margin: 1rem 0;
}
.k-block-type-card-category {
margin-top: 1rem;
color: #333;
}
.k-block-type-accset-heading {
margin: 1rem 0;
}
.k-block-type-accset-item {
margin-bottom: 1rem;
}
.k-block-type-testimonial-quote footer {
margin-top: 1rem;
}
.k-block-type-testimonial-quote p {
border-left: 2px solid black;
padding-left: .75rem;
max-width: 25rem;
}
.k-block-type-testimonial-voice {
display: flex;
align-items: center;
}
.k-block-type-testimonial-voice img {
margin-right: 10px;
}
.k-block-type-testimonial-voice input {
border: none;
}
.padded {
padding: 10px;
}
.k-aspect-ratio video{
pointer-events: none;
}
\ No newline at end of file
panel.plugin("squareclouds/blocks-factory", {
blocks: {
// AUDIO
audio: {
computed: {
source() {
return this.content.source[0] || {};
},
},
template: `
<div>
<div v-if="source.url">
<h1>
<k-writer
ref="title"
:inline="true"
marks="false"
:placeholder="'Keine Beschriftung'"
:value="content.title"
@input="update({ title: $event })"
/>
</h1>
<h2>
<k-writer
ref="subtitle"
:inline="true"
marks="false"
:placeholder="'Keine Subheadline'"
:value="content.subtitle"
@input="update({ subtitle: $event })"
/>
</h2>
<audio controls>
<source :src="source.url" type="audio/mpeg">
</audio>
</div>
<div v-else>No audio selected</div>
</div>
`,
},
// TOAST
toast: {
computed: {
textField() {
return this.field("text");
},
},
template: `
<div :class="'k-innerblock-type-toast toast-' + content.toasttype">
<k-writer
class="label"
ref="textbox"
:marks="textField.marks"
:value="content.text"
:placeholder="textField.placeholder || 'Enter text...'"
@input="update({ text: $event })"
/>
<k-icon
v-if="content.type !== 'neutral'"
class="k-block-type-toast-icon"
:type="content.toasttype"
/>
</div>
`,
},
// NEXT EVENT
nextevent: {
computed: {
pagename() {
return this.content.relatedpage[0] || {};
},
},
template: `
<div class="k-innerblock-type-nextevent">
<div v-if="pagename.text">
<h4>Selected Next Event: </h4>
<h3 v-html="pagename.text"></h3>
</div>
<div v-else>No next event page selected yet</div>
</div>
`,
},
// ACCORDION ELEMENT
accordion_element: {
computed: {
summaryField() {
return this.field("summary");
},
detailsField() {
return this.field("details");
},
},
template: `
<div @dblclick="open">
<details>
<summary>
<k-writer
ref="summary"
:inline="true"
marks="false"
:placeholder="summaryField.placeholder || 'Add a summary…'"
:value="content.summary"
@input="update({ summary: $event })"
/>
</summary>
<k-writer
ref="details"
:inline="detailsField.inline || false"
:marks="detailsField.marks"
:value="content.details"
:placeholder="detailsField.placeholder || 'Add some details'"
@input="update({ details: $event })"
/>
</details>
</div>
`,
},
// ACCORDION
accordion: {
computed: {
accHeadingField() {
return this.field("heading");
},
},
template: `
<div @dblclick="open">
<div :data-level="content.level" class="k-block-type-heading-input padded">
<k-writer
ref="heading"
:inline="accHeadingField.inline || false"
:marks="accHeadingField.marks"
:value="content.heading"
:placeholder="accHeadingField.placeholder || 'Add some headline'"
@input="update({ heading: $event })"
/>
</div>
<div v-if="content.elements.length">
<details
class="k-block-type-accset-item"
v-for="(item, index) in content.elements"
:key="index"
>
<summary v-html="item.content.summary"></summary>
<div v-html="item.content.details"></div>
</div>
</details>
</div>
<div v-else>No items yet</div>
</div>
`,
},
// CARD
card: {
computed: {
headingField() {
return this.field("heading");
},
textField() {
return this.field("text");
},
heading() {
return this.content.heading || "Heading...";
},
image() {
return this.content.image[0] || {};
},
text() {
return this.content.text || "Text...";
},
},
template: `
<div @dblclick="open">
<k-aspect-ratio
class="k-block-type-card-image"
cover="true"
ratio="1/1"
>
<img
v-if="image.url"
:src="image.url"
alt=""
>
</k-aspect-ratio>
<h2 class="k-block-type-card-heading">
<k-writer
ref="input"
:inline="headingField.inline"
:marks="headingField.marks"
:placeholder="headingField.placeholder"
:value="content.heading"
@input="update({ heading: $event })"
/>
</h2>
<k-writer
ref="input"
:inline="textField.inline"
:marks="textField.marks"
:nodes="textField.nodes"
:placeholder="textField.placeholder"
:value="content.text"
class="k-block-type-card-text"
@input="update({ text: $event })"
/>
</div>
`,
},
// BUTTON
button: {
computed: {
page() {
return this.content.linkedmodal[0] || "No page selected";
},
},
template: `
<div @dblclick="open">
<input
type="button"
placeholder="Button text …"
:value="content.btn_label"
@input="update({ btn_label: $event.target.value })"
/>
</div>
`,
},
// VIDEOVLITE
videovlite: {
computed: {
captionMarks() {
return this.field("caption", { marks: true }).marks;
},
isExternal() {
if (this.content.location === "web") {
return false;
}
if (this.content.location === "kirby") {
return false;
}
return true;
},
videosrc() {
if (this.content.location === "web") {
return this.content.src;
} else if (
this.content.location === "kirby" &&
this.content.video[0]?.url
) {
return this.content.video[0].url;
} else if (this.content.location == "vimeo") {
var vim = "https://vimeo.com/" + this.content.vimeoid;
return vim;
} else if (this.content.location == "youtube") {
var yt = "https://youtu.be/" + this.content.youtubeid;
return yt;
}
return false;
},
video() {
return this.$helper.embed.video(this.videosrc, true);
},
empty() {
return "Please select a video";
},
},
template: `
<div v-if="isExternal">
<b v-html="videosrc"></b>
<k-block-figure
:caption="content.caption"
:caption-marks="captionMarks"
:empty-text="$t('field.blocks.video.placeholder') + ' …'"
:is-empty="!video"
empty-icon="video"
@open="open"
@update="update"
>
<k-aspect-ratio ratio="16/9">
<iframe
v-if="video"
:src="video"
referrerpolicy="strict-origin-when-cross-origin"
/>
</k-aspect-ratio>
</k-block-figure>
</div>
<div v-else>
<b v-html="videosrc"></b>
<k-block-figure
:empty-text="empty + ' …'"
:is-empty="!videosrc"
@open="open"
@update="update"
>
<k-aspect-ratio ratio="16/9">
<video controls>
<source
v-if="videosrc"
:src="videosrc" type="video/mp4">
Your browser does not support the video tag.
</video>
</k-aspect-ratio>
</k-block-figure>
</div>
`,
},
},
});
<?php
Kirby::plugin('squareclouds/blocks-factory', [
'blueprints' => [
'blocks/heading' => __DIR__ . '/blueprints/blocks/heading.yml',
'blocks/text' => __DIR__ . '/blueprints/blocks/text.yml',
'blocks/styledtext' => __DIR__ . '/blueprints/blocks/styledtext.yml',
'blocks/image' => __DIR__ . '/blueprints/blocks/image.yml',
'blocks/downloaditem' => __DIR__ . '/blueprints/blocks/downloaditem.yml',
'blocks/gridbox' => __DIR__ . '/blueprints/blocks/gridbox.yml',
'blocks/accordion_element' => __DIR__ . '/blueprints/blocks/accordion_element.yml',
'blocks/accordion' => __DIR__ . '/blueprints/blocks/accordion.yml',
'blocks/toast' => __DIR__ . '/blueprints/blocks/toast.yml',
'blocks/card' => __DIR__ . '/blueprints/blocks/card.yml',
'blocks/nextevent' => __DIR__ . '/blueprints/blocks/nextevent.yml',
'blocks/button' => __DIR__ . '/blueprints/blocks/button.yml',
'blocks/video' => __DIR__ . '/blueprints/blocks/video.yml',
'blocks/videovlite' => __DIR__ . '/blueprints/blocks/videovlite.yml',
'blocks/qrcodeblock' => __DIR__ . '/blueprints/blocks/qrcodeblock.yml',
'blocks/threedmodel' => __DIR__ . '/blueprints/blocks/threedmodel.yml',
'blocks/mainpage_navitem' => __DIR__ . '/blueprints/blocks/mainpage_navitem.yml',
'blocks/subpage_navitem' => __DIR__ . '/blueprints/blocks/subpage_navitem.yml',
'blocks/table' => __DIR__ . '/blueprints/blocks/table.yml',
'blocks/audio' => __DIR__ . '/blueprints/blocks/audio.yml',
'blocks/spacing' => __DIR__ . '/blueprints/blocks/spacing.yml',
],
'snippets' => [
'blocks/heading' => __DIR__ . '/snippets/blocks/heading.php',
'blocks/text' => __DIR__ . '/snippets/blocks/text.php',
'blocks/styledtext' => __DIR__ . '/snippets/blocks/styledtext.php',
'blocks/image' => __DIR__ . '/snippets/blocks/image.php',
'blocks/downloaditem' => __DIR__ . '/snippets/blocks/downloaditem.php',
'blocks/gridbox' => __DIR__ . '/snippets/blocks/gridbox.php',
'blocks/accordion_element' => __DIR__ . '/snippets/blocks/accordion_element.php',
'blocks/accordion' => __DIR__ . '/snippets/blocks/accordion.php',
'blocks/toast' => __DIR__ . '/snippets/blocks/toast.php',
'blocks/card' => __DIR__ . '/snippets/blocks/card.php',
'blocks/nextevent' => __DIR__ . '/snippets/blocks/nextevent.php',
'blocks/button' => __DIR__ . '/snippets/blocks/button.php',
'blocks/video' => __DIR__ . '/snippets/blocks/video.php',
'blocks/videovlite' => __DIR__ . '/snippets/blocks/videovlite.php',
'blocks/qrcodeblock' => __DIR__ . '/snippets/blocks/qrcodeblock.php',
'blocks/threedmodel' => __DIR__ . '/snippets/blocks/threedmodel.php',
'blocks/mainpage_navitem' => __DIR__ . '/snippets/blocks/mainpage_navitem.php',
'blocks/subpage_navitem' => __DIR__ . '/snippets/blocks/subpage_navitem.php',
'blocks/table' => __DIR__ . '/snippets/blocks/table.php',
'blocks/audio' => __DIR__ . '/snippets/blocks/audio.php',
'blocks/spacing' => __DIR__ . '/snippets/blocks/spacing.php',
],
'translations' => [
'en' => [
'field.blocks.styledtext.name' => 'Styled text',
'field.blocks.downloaditem.name' => 'Download item',
'field.blocks.gridbox.name' => 'Grid box',
'field.blocks.accordion_element.name' => 'Accordion, single',
'field.blocks.accordion.name' => 'Accordion group',
'field.blocks.toast.name' => 'Toast',
'field.blocks.card.name' => 'Card',
'field.blocks.nextevent.name' => 'Next related Event',
'field.blocks.button.name' => 'Button',
'field.blocks.videovlite.name' => 'Video Vlite',
'field.blocks.qrcodeblock.name' => 'QR Code',
'field.blocks.threedmodel.name' => '3D model',
'field.blocks.mainpage_navitem.name' => 'Main page, Navi-Item',
'field.blocks.subpage_navitem.name' => 'Sub page, Navi-Item',
'field.blocks.table.name' => 'Table',
'field.blocks.audio.name' => 'Audio',
'field.blocks.audio.spacing' => 'Spacing',
],
'de' => [
'field.blocks.styledtext.name' => 'Gestylter Text',
'field.blocks.downloaditem.name' => 'Download-Item',
'field.blocks.gridbox.name' => 'Grid-Box',
'field.blocks.accordion_element.name' => 'Akkordeon, single',
'field.blocks.accordion.name' => 'Akkordeon-Gruppe',
'field.blocks.toast.name' => 'Toast',
'field.blocks.card.name' => 'Kärtchen',
'field.blocks.nextevent.name' => 'Nächstes verbandtes Event',
'field.blocks.button.name' => 'Button',
'field.blocks.videovlite.name' => 'Video Vlite',
'field.blocks.qrcodeblock.name' => 'QR Code',
'field.blocks.threedmodel.name' => '3D Modell',
'field.blocks.mainpage_navitem.name' => 'Hauptseite, Navi-Item',
'field.blocks.subpage_navitem.name' => 'Subseite, Navi-Item',
'field.blocks.table.name' => 'Tabelle',
'field.blocks.audio.name' => 'Audio',
'field.blocks.audio.spacing' => 'Abstand',
]
]
]);
<?php $accordionItems = $block->elements()->toBlocks(); ?>
<div class="accordion-section">
<?php if ($accordionItems->isNotEmpty()) : ?>
<<?= $level = $block->level()->or('h2') ?>><?= $block->heading() ?></<?= $level = $block->level()->or('h2') ?>>
<?php foreach ($accordionItems as $key=>$accordionItem) : ?>
<?php snippet('blocks/' . $accordionItem->type(), [
'block' => $accordionItem,
'index' => $accordionItem->indexOf(),
'as_group' => $block->group()->toBool(),
'parentid' => $block->id()
]) ?>
<?php endforeach ?>
<?php endif; ?>
</div>
\ No newline at end of file
<?php
$_index = isset($index) && $index >= 0 ? $index : $block->id();
$_as_group = isset($as_group) ? $as_group : false;
$_parentid = isset($parentid) ? '-' . $parentid : $block->id();
?>
<div class="acc-el">
<?php if ($_as_group) : ?>
<?php if ($block->summary()->isNotEmpty()) : ?>
<input type="radio" id="accrad-<?= $_index ?>" name="accordion" />
<label class="acc-item" for="accrad-<?= $_index ?>">
<div class="acc-title">
<?= $block->summary() ?>
</div>
<div class="acc-content">
<?= $block->details() ?>
</div>
</label>
<?php endif; ?>
<?php else : ?>
<?php if ($block->summary()->isNotEmpty()) : ?>
<input type="checkbox" id="accchk-<?= $_index ?>" name="accordion" />
<label class="acc-item" for="accchk-<?= $_index ?>">
<div class="acc-title">
<?= $block->summary() ?>
</div>
<div class="acc-content">
<?= $block->details() ?>
</div>
</label>
<?php endif; ?>
<?php endif ?>
</div>
\ No newline at end of file
<?php if ($file = $block->source()->toFile()): ?>
<div class="audio-wrapper">
<p class="h3 audio-title"><?= $block->title()->or($file->title()) ?></p>
<p class="audio-subtitle"><?= $block->subtitle()->or($file->subtitle()) ?></p>
<!-- Audio Player -->
<audio class="audio-element" aria-describedby="audio-desc__<?= Str::slug($file->uuid()) ?>"
<?= $block->controls()->isTrue() ? 'controls' : '' ?>
<?= $block->autoplay()->isTrue() ? 'autoplay' : '' ?>>
<source src="<?= $file->url() ?>" type="<?= $file->mime() ?>">
<?= t('audio.noSupport') ?>
</audio>
<!-- Hidden Description for Screen Readers -->
<p id="audio-desc__<?= Str::slug($file->uuid()) ?>" class="visually-hidden">
<?= $block->description()->or($file->description()) ?>
</p>
<!-- Transcript Section -->
<?php if ($block->transcript()->isNotEmpty() || $file->transcript()->isNotEmpty()): ?>
<div>
<button id="toggle-transcript__<?= Str::slug($file->uuid()) ?>"
aria-expanded="false"
class="btn transcript-btn"
aria-controls="transcript__<?= Str::slug($file->uuid()) ?>"
data-transcript="transcript__<?= Str::slug($file->uuid()) ?>"
data-hide_label="<?= t('audio.transcript.buttonLabel.hide') ?>"
data-show_label="<?= t('audio.transcript.buttonLabel.show') ?>">
<?= t('audio.transcript.buttonLabel.show') ?>
</button>
</div>
<div id="transcript__<?= Str::slug($file->uuid()) ?>" class="transcript" hidden aria-live="polite">
<strong><?= t('audio.transcript.label') ?>:</strong>
<?= $block->transcript()->or($file->transcript()) ?>
</div>
<?php endif ?>
</div>
<?php endif ?>
\ No newline at end of file
<span>
<a class="button" href="<?= $block->linkage()->toUrl() ?>" <?= $block->target()->toBool() ? 'target="_blank"' : '' ?>>
<?= $block->btn_label()->or($block->linkage())->or('EMPTY') ?>
</a>
</span>
\ No newline at end of file
<?php
$link = $block->link()->value();
$image = $block->image()->toFile();
$heading = $block->heading();
$text = $block->text();
$srcsetargs = [
'400w' => ['height' => 225, 'width' => 400, 'quality' => 79, 'format' => 'webp'],
'800w' => ['height' => 450, 'width' => 800, 'quality' => 79, 'format' => 'webp'],
'1200w' => ['height' => 562, 'width' => 1000, 'quality' => 79, 'format' => 'webp']
];
?>
<?php if ($block->isNotEmpty()) : ?>
<div class="card">
<?php if (!empty($link)) : ?>
<a href="<?= $link ?>">
<?php endif; ?>
<?php if ($image) : ?>
<div class="card-image img" style="--w:16;--h:9">
<?= $image->responsiveImg('img-responsive'); ?>
</div>
<?php endif ?>
<div class="card-header">
<div class="card-title h3">
<?= $heading ?>
</div>
</div>
<div class="card-body">
<?= $text ?>
</div>
<?php if (!empty($link)) : ?>
</a>
<?php endif; ?>
</div>
<?php endif; ?>
\ No newline at end of file
<?php
/** @var \Kirby\Cms\Block $block */ ?>
<a class="link_dwnld" href="<?= $block->link()->toUrl() ?>" <?= $block->target()->toBool() === true ? 'target="_blank"' : '' ?>>
<?= $block->linkText()->or($block->link()) ?>
</a>
\ No newline at end of file
<?php
$ratio = $block->ratio()->or('auto');
$src = null;
$txtcolor = $block->txtcolor();
$bgcolor = $block->bgcolor();
$imgalpha = $block->imagealpha()->value();
$class = $block->gradient()->toBool() ? 'gradient' : '';
$is_fake3D = $block->image_is_fake3d()->isTrue();
$tresholdX = $block->fake3d_threshx()->value() ?? 50;
$tresholdY = $block->fake3d_threshy()->value() ?? 50;
$imgFocusx = $block->fake3d_focusx()->value() ?? 50;
$imgFocusy = $block->fake3d_focusy()->value() ?? 50;
if (!isset($imgcollection)) {
if ($image = $block->image()->toFile()) {
$src = $image;
}
}
$class .= $block->mobilecard()->toBool() ? ' visuals' : '';
$ratios = '';
if ($ratio != 'auto') {
$ratio = Str::split($ratio, '/');
$w = $ratio[0] ?? 1;
$h = $ratio[1] ?? 1;
$ratios = '--w:' . $w . '; --h:' . $h . '; ';
}
$attrs = attr([
'style' => $ratios . '--tColor:' . $txtcolor . '; --bgColor:' . $bgcolor . ';',
'class' => 'gridbox shadow ' . $class,
]);
?>
<div <?= $attrs ?>>
<?php if (isset($imgcollection)) : ?>
<div class="swiper ui-white" id="swiper-<?= $block->id() ?>">
<!-- Additional required wrapper -->
<div class="swiper-wrapper">
<!-- Slides -->
<?php foreach ($imgcollection as $imageitem) : ?>
<?php $imageitem = $imageitem->toFile(); ?>
<div class="swiper-slide">
<div class="img-container" style="--imgalpha:<?= $imgalpha ?>">
<img class="gridbox-bg" style="--objPos:<?= $imageitem->focus() ?>;" src="<?= $imageitem->placeholderUri() ?>" data-srcset="<?= $imageitem->srcset() ?>" data-lazyload alt="<?= $imageitem->alt() ?>" title="<?= $imageitem->alt() ?>">
</div>
</div>
<?php endforeach ?>
</div>
<div class="overlay"></div>
<!-- If we need pagination -->
<div class="swiper-pagination"></div>
</div>
<?php else : ?>
<?php if ($is_fake3D && $depthmap = $block->image_depthmap()->toFile()) : ?>
<div class="img-container" style="--imgalpha:<?= $imgalpha ?>">
<div class="fake3d-frame" style="--w: <?= $src->width() ?>; --h: <?= $src->height() ?>">
<div class="f3d-canvas" id="gl-<?=$block->id()?>" data-focusx="<?= $imgFocusx ?>" data-focusy="<?= $imgFocusy ?>" data-imageOriginal="<?= $src->url() ?>" data-imageDepth="<?= $depthmap->url() ?>" data-horizontalThreshold="<?= 101 - $tresholdX ?>" data-verticalThreshold="<?= 101 - $tresholdY ?>">
</div>
<div id="f3d-loader-<?=$block->id()?>" class="cpb-progress-container"></div>
</div>
</div>
<div class="overlay"></div>
<?php else : ?>
<?php if ($src) : ?>
<div class="img-container" style="--imgalpha:<?= $imgalpha ?>">
<img class="gridbox-bg" src="<?= $src->placeholderUri() ?>" data-srcset="<?= $src->srcset() ?>" data-lazyload style="--objPos:<?= $src->focus() ?>;">
</div>
<div class="overlay"></div>
<?php endif ?>
<?php endif ?>
<?php endif ?>
<div class="text-area">
<?php if ($block->headline()->isNotEmpty()) : ?>
<?= $block->headline() ?>
<?php endif ?>
<?php if ($block->text()->isNotEmpty()) : ?>
<?= $block->text() ?>
<?php endif ?>
<?php if ($block->cta()->isTrue()) : ?>
<?php if ($obj = $block->cta_link()->toObject()) : ?>
<?php if ($obj->is_script()->toBool()) : ?>
<button class="btn" onclick="<?= $obj->callback() ?>"><?= $obj->linkText()->or('EMPTY') ?></button>
<?php else : ?>
<a class="btn" href="<?= $obj->link()->toUrl() ?>"><?= $obj->linkText()->or('EMPTY') ?></a>
<?php endif ?>
<?php endif ?>
<?php endif ?>
</div>
</div>
\ No newline at end of file
<?php
/** @var \Kirby\Cms\Block $block */ ?>
<?php
$pre_class = $block->pre_class()->isNotEmpty() ? $block->pre_class()->value() : '';
$responsive_hide = $block->responsive_hide()->isNotEmpty() ? $block->responsive_hide()->value() : '';
$class = $block->cssclass()->or('');
$element_id = $block->cssid();
?>
<<?= $level = $block->level()->or('h2') ?>
<?= e($block->cssid()->isNotEmpty(), 'id="' . $element_id . '"') ?>
<?= e($block->pre_class()->isNotEmpty() || $block->cssclass()->isNotEmpty() || $block->responsive_hide()->isNotEmpty(), 'class="' . $class . ' ' . $pre_class . ' ' . $responsive_hide . '"') ?>> <?= $block->text()->permalinksToUrls() ?> </<?= $level ?>>
\ No newline at end of file
<?php
/** @var \Kirby\Cms\Block $block */
$figureClassArray = [];
$imgClassArray = [];
$alt = $block->alt();
$caption = $block->caption();
$crop = $block->crop()->isTrue();
$link = $block->link();
$target_blank = $block->target_blank()->isTrue();
$ratio = $block->ratio()->or('auto');
$cssclass = $block->cssclass()->or('');
$src = null;
if ($crop)
array_push($figureClassArray, 'crop');
$figureStyle = '';
$figureClass = implode(" ", $figureClassArray);
$imgClass = implode(" ", $imgClassArray);
$imgClass .= " " . $cssclass;
$isSVG = false;
if ($block->location() == 'web') {
$src = $block->src()->esc();
} elseif ($image = $block->image()->toFile()) {
$alt = $alt->or($image->alt());
$caption = $caption->or($image->caption());
$src = $image->url();
$isSVG = ($image->extension() == "svg") ? true : false;
}
if ($ratio == 'auto') {
$figureClass .= " auto";
} else {
$figureClass .= " ratioed";
$ratioData = explode('/', $ratio);
$figureStyle = 'style = "--w: ' . $ratioData[0] . '; --h: ' . $ratioData[1] . ';"';
}
$desktopW = $span / 12 * 100;
$sizes = 'sizes = "(min-width:1080px) ' . floor($desktopW) . 'vw,
100vw"';
?>
<?php if ($src) : ?>
<figure class="<?= $figureClass ?>" <?= $figureStyle ?>>
<?php
// WITH LINK
if ($link->isNotEmpty() && $block->linkactive()->isTrue()) : ?>
<a <?= e($target_blank, 'target="_blank"') ?> href="<?= Str::esc($link->toUrl()) ?>" title="<?= $block->link_desc() ?>">
<?php
// check if from web
if ($block->location() == 'web') : ?>
<img class="<?= $imgClass ?>" src="<?= $src ?>" alt="<?= $alt->esc() ?>">
<?php
// if local, check svg or no scr setting
elseif ($isSVG) : ?>
<img class="svg <?= $imgClass ?>" src="<?= $src ?>" alt="<?= $alt->esc() ?>">
<?php else : ?>
<?= $image->responsiveImg($alt, $imgClass, $sizes); ?>
<?php endif ?>
</a>
<?php else :
// NO LINK
?>
<?php
// check if from web
if ($block->location() == 'web') : ?>
<img class="<?= $imgClass ?>" src="<?= $src ?>" alt="<?= $alt->esc() ?>">
<?php
// if local, check svg or no scr setting
elseif ($isSVG) : ?>
<img class="svg <?= $imgClass ?>" src="<?= $src ?>" alt="<?= $alt->esc() ?>">
<?php else : ?>
<?= $image->responsiveImg($alt, $imgClass, $sizes); ?>
<?php endif ?>
<?php endif ?>
<?php if ($caption->isNotEmpty()) : ?>
<figcaption>
<?= $caption ?>
</figcaption>
<?php endif ?>
</figure>
<?php endif ?>
\ No newline at end of file
<?php if ($item = $block->obj()->toObject()) : ?>
<?php $image = $item->photo()->toFile(); ?>
<div class="card mainnav-item" style="background-image: url('<?= $image ? $image->url() : '' ?>')">
<?php if ($lp = $item->linkedPage()->toPage()) : ?>
<a class="no-decoration" href="<?= $lp->url() ?>">
<?php endif ?>
<div class="card-body">
<?php if ($item->headline()->isNotEmpty()) : ?>
<div class="h2-container">
<h2><?= $item->headline() ?></h2>
</div>
<?php endif ?>
<?php if ($item->btn_label()->isNotEmpty() && $lp) : ?>
<div class="btn-container">
<button class="btn btn-primary"><?= $item->btn_label() ?><i class="fas fa-arrow-right"></i></button>
</div>
<?php endif ?>
</div>
<?php if ($lp) : ?>
</a>
<?php endif ?>
</div>
<?php endif ?>
\ No newline at end of file
<figure class="auto qrcode">
<?php $label = $block->qrlabel() ?>
<?= $page->qrcode(['labelText' => (string)$label,])->html(
$page->slug() . '.png', // image format detected from extension
['class' => 'qrcode']
); ?>
</figure>
\ No newline at end of file
<hr class="spacing-<?= $block->size() ?>">
\ No newline at end of file
<?php
/** @var \Kirby\Cms\Block $block */ ?>
<?php
$styles = "";
$styles .= $block->txtcolor()->isNotEmpty() ? "--b-fc:" . $block->txtcolor() . ";" : "";
$styles .= $block->fontsize()->isNotEmpty() ? "--b-fs: calc(" . $block->fontsize() . " * var(--fs-base));" : "";
$styles .= $block->fontweight()->isNotEmpty() ? "--b-fw:" . $block->fontweight() . ";" : "";
$styles .= $block->fontfamily()->isNotEmpty() ? "--b-ff:" . $block->fontfamily() . ";" : "";
$pre_class = $block->pre_class()->isNotEmpty() ? $block->pre_class()->value() : '';
$class = $block->class()->or('');
?>
<?php if (strlen($styles) > 0) : ?>
<span class="txt-styled <?= e($pre_class || $class, $class . ' ' . $pre_class) ?>" style="<?= $styles ?>">
<?= $block->text(); ?>
</span>
<?php else : ?>
<span <?= e($pre_class || $class, 'class="' . $class . ' ' . $pre_class . '"') ?>>
<?= $block->text(); ?>
</span>
<?php endif ?>
\ No newline at end of file
<?php if ($item = $block->obj()->toObject()) : ?>
<div class="card subnav-item">
<div class="btn-type type-<?= $item->btn_type() ?>">
icon
</div>
<div class="card-body">
<div class="headings">
<?php if ($item->headline()->isNotEmpty()) : ?>
<div class="h2-container">
<h2><?= $item->headline() ?></h2>
</div>
<?php endif ?>
<?php if ($item->subheadline()->isNotEmpty()) : ?>
<div class="h3-container">
<h3><?= $item->subheadline() ?></h3>
</div>
<?php endif ?>
</div>
<!-- button -->
<?php if ($p = $item->linkedmodal()->toPage()) : ?>
<?php if (!$p->isDraft()) : ?>
<button class="btn btn-primary" type="button" data-bs-toggle="modal" data-bs-target="#modal__<?= $item->linkedmodal()->toPage()->uid() ?>">
<?= $item->btn_label()->or($item->linkedmodal()->toPage()->title()) ?><i class="fas fa-arrow-right"></i>
</button>
<?php else : ?>
<button class="btn btn-primary" disabled>Modal inactive</button>
<?php endif ?>
<?php else : ?>
<button class="btn btn-primary" disabled>No modal selected</button>
<?php endif ?>
</div>
</div>
<?php endif ?>
\ No newline at end of file
<?php
$rows = $block->rows()->toStructure();
if ($rows->isNotEmpty()) :?>
<table class="table <?= e($block->striped()->toBool(), 'table-striped') ?>">
<?php if($block->showheader()->toBool()) : ?>
<thead>
<tr>
<th><?= $block->leftheader() ?></th>
<th><?= $block->rightheader() ?></th>
</tr>
</thead>
<?php endif; ?>
<tbody>
<?php foreach ($rows as $row) : ?>
<tr>
<td><?= $row->topic() ?></td>
<td><?= $row->description() ?></td>
</tr>
<?php endforeach ?>
</tbody>
</table>
<?php endif; ?>
\ No newline at end of file
<?php
$pre_class = $block->pre_class()->isNotEmpty() ? $block->pre_class()->value() : '';
$responsive_hide = $block->responsive_hide()->isNotEmpty() ? $block->responsive_hide()->value() : '';
$cssclass = $block->cssclass()->or('');
?>
<?php /** @var \Kirby\Cms\Block $block */ ?>
<?php if ($block->pre_class()->isNotEmpty() || $block->cssclass()->isNotEmpty() || $block->responsive_hide()->isNotEmpty()): ?>
<span class="<?= $cssclass . ' ' . $pre_class . ' ' . $responsive_hide ?>">
<?php endif ?>
<?= $block->text()->permalinksToUrls() ?>
<?php if ($block->pre_class()->isNotEmpty() || $block->cssclass()->isNotEmpty() || $block->responsive_hide()->isNotEmpty()): ?>
</span>
<?php endif ?>
\ No newline at end of file
<script>
self.ModelViewerElement = self.ModelViewerElement || {};
self.ModelViewerElement.dracoDecoderLocation = '<?= kirby()->url() ?>/assets/js/vendor/decoder/';
</script>
<?= js('/assets/js/vendor/model-viewer.min.js', ['type' => 'module']) ?>
<?php
$imgurl = "";
$imgalt = "";
$modelurl = "";
$exposure = 1;
if ($img = $block->placeholder()->toFile()) {
$imgurl = $img->thumb([
'width' => 250,
'quality' => 5,
])->url();
$imgalt = $img->alt();
}
if ($model = $block->threed_model()->toFile())
$modelurl = $model->url();
$exposure = $block->threed_model_light()->value();
$ratio = $block->ratio()->or('16/9');
if ($ratio !== 'auto') {
$ratio = Str::split($ratio, '/');
$w = $ratio[0] ?? 1;
$h = $ratio[1] ?? 1;
}
$attrs = attr([
'style' => 'aspect-ratio:' . $w . '/' . $h,
]);
?>
<?php if ($modelurl) : ?>
<div class="object__viewer" <?= $attrs ?>>
<model-viewer class="exhibit-3d" id="reveal" loading="eager" exposure="<?= $exposure ?>" disable-tap disable-pan camera-controls touch-action="pan-y" auto-rotate poster="<?= $imgurl ?>" src="<?= $modelurl ?>" shadow-intensity="0" alt="<?= $imgalt ?>" style="background-color: unset;">
<div class="viewer-progress" slot="progress-bar"></div>
</model-viewer>
</div>
<?php elseif (!$modelurl && $imgurl) : ?>
<div class="digital__container row justify-content-center">
<div class="col align-self-center text-center exhibit-digital">
<div id="gallery" class="pswp-gallery">
<a class="pswp-gallery__item" href="<?= $img->url() ?>" target="_blank" data-pswp-width="<?= $img->width() ?>" data-pswp-height="<?= $img->height() ?>">
<?= $img->responsiveImg($imgalt) ?>
</a>
</div>
</div>
</div>
<?php else : ?>
<div class="object__viewer" <?= $attrs ?>>
<div class="exhibit-3d no-object row justify-content-center text-center">
<span class="empty w-50 text-primary"><i data-lucide="help-circle" class="icon-only"></i></span>
</div>
</div>
<?php endif ?>
\ No newline at end of file
<?php if($block->text()->isNotEmpty()): ?>
<div class="toast toast-<?= $block->toastType() ?>">
<?= $block->text() ?>
</div>
<?php endif; ?>
\ No newline at end of file
<?php
use Kirby\Cms\Html;
/** @var \Kirby\Cms\Block $block */
if (
$block->location() == 'kirby' &&
$video = $block->video()->toFile()
) {
// recheck, since the file might have own information
$caption = $block->caption()->or($video->caption());
$alt = $block->alt()->or($video->alt());
$desc = $block->description()->or($video->description());
$url = $video->url();
$attrs = array_filter([
'autoplay' => $block->autoplay()->toBool(),
'controls' => $block->controls()->toBool(),
'loop' => $block->loop()->toBool(),
'muted' => $block->muted()->toBool() || $block->autoplay()->toBool(),
'playsinline' => $block->autoplay()->toBool(),
'poster' => $video->poster()->toFile()?->url(),
'preload' => $block->preload()->value(),
'aria-describedby' => "video-desc-" . $block->id(),
'title' => $alt,
'id' => $block->id(),
]);
} else {
$url = $block->url();
$desc = $block->description();
$caption = $block->caption();
$alt = $block->alt();
$attrs = array_filter([
/* 'autoplay' => $block->autoplay()->toBool(),
'controls' => $block->controls()->toBool(),
'loop' => $block->loop()->toBool(),
'muted' => $block->muted()->toBool() || $block->autoplay()->toBool(),
'playsinline' => $block->autoplay()->toBool(),
'poster' => $block->poster()->toFile()?->url(),
'preload' => $block->preload()->value(), */
'frameborder' => '0', // not working
'aria-describedby' => "video-desc-" . $block->id(),
'allowfullscreen' => 'true',
'allow' => 'fullscreen',
'title' => $alt,
'id' => $block->id(),
]);
}
?>
<?php if (
$block->location() == 'kirby' &&
$video = $block->video()->toFile()
): ?>
<figure>
<video <?= attr($attrs ?? []) ?>>
<source src="<?= $url ?>" type="video/mp4" />
<!-- for blind people -->
<?php if ($vtt_description = $video->content()->get('vtt_description_' . $kirby->language())): ?>
<track src="<?= $vtt_description->toFile() ?>" kind="descriptions" srclang="<?= $kirby->language() ?>" label="<?= $video->content()->get('vtt_description_label_' . $kirby->language()) ?>">
<?php endif ?>
<!-- for deaf people -->
<?php if ($vtt_captions_de = $video->vtt_captions_de()->toFile()): ?>
<track src="<?= $vtt_captions_de->url() ?>" kind="captions" srclang="de" label="<?= $video->vtt_captions_label_de() ?>">
<?php endif ?>
<?php if ($vtt_captions_en = $video->vtt_captions_en()->toFile()): ?>
<track src="<?= $vtt_captions_en->url() ?>" kind="captions" srclang="en" label="<?= $video->vtt_captions_label_en() ?>">
<?php endif ?>
<?= t('video.noSupport') ?>
</video>
<?php if ($caption): ?>
<figcaption><?= $caption ?></figcaption>
<?php endif ?>
</figure>
<?php else: ?>
<?php
$cookie = $_COOKIE['cc_cookie'] ?? null;
if ($cookie) {
$cookieData = json_decode($_COOKIE['cc_cookie'], true);
$externalVideos = in_array('experience', $cookieData['categories']) ?? null;
} else {
$externalVideos = false;
}
if ($externalVideos): ?>
<?php if ($video = Html::video($url, [], $attrs ?? [])): ?>
<figure class="iframe-container">
<?= $video ?>
<?php if ($caption): ?>
<figcaption><?= $caption ?></figcaption>
<?php endif ?>
</figure>
<?php endif ?>
<?php else: ?>
<figure class="crop ratioed">
<div class="video-placeholder" data-src="<?= $url ?>">
<p><?= snippet('t_labels', ['var' => 'cookies.activateCookies']) ?></p>
</div>
<?php if ($caption): ?>
<figcaption><?= $caption ?></figcaption>
<?php endif ?>
</figure>
<?php endif ?>
<?php endif ?>
<?php if ($desc->isNotEmpty()): ?>
<p id="video-desc-<?= $block->id() ?>" class="visually-hidden">
<?= $desc ?>
</p>
<?php endif ?>
<?php if ($vtt_description ?? null): ?>
<p id="descAudioOutput__<?= $block->id() ?>" class="visually-hidden" aria-live="polite"></p>
<?php endif ?>
\ No newline at end of file
<?php
$src = null;
$providerAttr = null;
$provider = null;
if ($block->location() == 'web') {
$src = $block->src();
} elseif ($block->location() == 'vimeo') {
$providerAttr = 'data-vimeo-id="' . $block->vimeoID() . '"';
$provider = 'vimeo';
} elseif ($block->location() == 'youtube') {
$providerAttr = 'data-youtube-id="' . $block->youtubeID() . '"';
$provider = 'youtube';
} elseif ($video = $block->video()->toFile()) {
$src = $video->url();
}
?>
<?php if ($src) : ?>
<video id="<?= $block->id() ?>" class="vlite-js modal__video <?= e($block->cover()->toBool(), 'cover') ?>" src="<?= $src ?>" crossorigin>
</video>
<?php elseif ($provider) : ?>
<div id="<?= $block->id() ?>" class="vlite-js modal__video <?= e($block->cover()->toBool(), 'cover') ?>" <?= $providerAttr ?> <?= "provider='" . $provider . "'" ?>></div>
<?php else : ?>
<div>No video selected</div>
<?php endif ?>
{
"name": "scd/custom-methods",
"description": "Field and file methods",
"type": "kirby-plugin",
"license": "GNU",
"authors": [
{
"name": "SCD, Santiago Duque",
"email": "sd@squareclouds.de"
}
],
"require": {
"getkirby/composer-installer": "^1.1"
}
}
<?php
/**
* Helpful extra functions for fields or files
* to get information more easily inside yaml files or php
*/
Kirby::plugin('scd/custom-methods', [
'collectionMethods' => [],
'pageMethods' => [
'zips' => function () {
return $this->files()->filterBy('template', 'zip');
},
'getsyncedfiles' => function () {
$currentFiles = $this->files()->filterBy('template', 'in', ['image', 'video', 'mp3']);
$resultAssets = $currentFiles;
$syncedPages = $this->sync_events()->toPages();
foreach ($syncedPages as $syncedPage) {
$resultAssets->add($syncedPage->files()->filterBy('template', 'in', ['image', 'video', 'mp3']));
}
$siteAssets = kirby()->site()->files();
$resultAssets->add($siteAssets);
return $resultAssets;
},
'getmixedimages' => function () {
$siteAssets = kirby()->site()->files()->filterBy('template', 'image');
$currentPage = $this;
$resultAssets;
if ($currentPage->isModule()) {
$resultAssets = $currentPage->page()->files()->filterBy('template', 'image');
} elseif ($currentPage->intendedTemplate() == "pressesub") {
$resultAssets = $currentPage->getsyncedfiles()->filterBy('template', 'image');
} else {
$resultAssets = $currentPage->files()->filterBy('template', 'image');
}
return $resultAssets->add($siteAssets);
},
'getmixedvideos' => function () {
$siteAssets = kirby()->site()->files()->filterBy('template', 'video');
$currentPage = $this;
$resultAssets;
if ($currentPage->isModule()) {
$resultAssets = $currentPage->page()->files()->filterBy('template', 'video');
} elseif ($currentPage->intendedTemplate() == "pressesub") {
$resultAssets = $currentPage->getsyncedfiles()->filterBy('template', 'video');
} else {
$resultAssets = $currentPage->files()->filterBy('template', 'video');
}
return $resultAssets->add($siteAssets);
},
'getmixedaudios' => function () {
$siteAssets = kirby()->site()->files()->filterBy('template', 'mp3');
$currentPage = $this;
$resultAssets;
if ($currentPage->isModule()) {
$resultAssets = $currentPage->page()->files()->filterBy('template', 'mp3');
} elseif ($currentPage->intendedTemplate() == "pressesub") {
$resultAssets = $currentPage->getsyncedfiles()->filterBy('template', 'mp3');
} else {
$resultAssets = $currentPage->files()->filterBy('template', 'mp3');
}
return $resultAssets->add($siteAssets);
},
],
'fieldMethods' => [
'toPagesAndDrafts' => function ($field) {
$result = new Pages();
if ($field && $field->isNotEmpty()) {
$selectedPages = $field->yaml();
foreach ($selectedPages as $page) {
$result->add(kirby()->page($page));
}
}
return $result;
},
'toPageOrDraft' => function ($field) {
if ($field && $field->isNotEmpty()) {
$selectedPages = $field->yaml();
foreach ($selectedPages as $page) {
$result = kirby()->page($page);
if ($result) {
return $result;
} else {
return false;
}
}
} else {
return false;
}
},
'dbstructure' => function ($field) {
$_structure = new Kirby\Cms\Structure();
$collection = $field->toStructure();
foreach ($collection as $item) {
$_structure->add(new Kirby\Cms\StructureObject([
'id' => $item->id(),
'content' => [
'desc' => $item->content()->get(kirby()->language()),
],
]));
}
return $_structure;
},
'mapValueToLabel' => function ($field) {
$context = $field->parent()->parent();
$options = $context->content()->get($field->key())->toStructure();
if ($field->value() != '' || $field->value() != null) {
$value = $options->findBy('id', $field->value());
if ($value) {
$value = $value->content()->get(kirby()->language());
}
} else {
$value = null;
}
return $value;
},
],
'fileMethods' => [
'responsiveImg' => function ($alt, $imgclass = 'regular-img', $sizes = null) {
$sizesAttr = "";
if ($sizes)
$sizesAttr = $sizes;
if ($this->focus()->isNotEmpty())
// $tag = "<img class='{$imgclass}' style='--objPos:{$this->focus()}' alt='{$alt}' src='{$this->src()}' srcset='{$this->srcset('webp')}' width='{$this->width()}' height='{$this->height()}' draggable='false' onerror=\"this.src='{$this->src()}'\">";
$tag = "<picture style='--objPos:{$this->focus()}'>
<source {$sizesAttr} srcset='{$this->srcset('webp')}' type='image/webp'>
<source {$sizesAttr} srcset='{$this->srcset('default')}' type='image/jpeg'>
<img class='{$imgclass}' alt='{$alt}' src='{$this->resize(900)->url()}' width='{$this->width()}' height='{$this->height()}' draggable='false'>
</picture>";
else
//$tag = "<img class='{$imgclass}' alt='{$alt}' srcset='{$this->srcset('webp')}' width='{$this->width()}' height='{$this->height()}' draggable='false' onerror=\"this.src='{$this->src()}'\">";
$tag = "<picture>
<source {$sizesAttr} srcset='{$this->srcset('webp')}' type='image/webp'>
<source {$sizesAttr} srcset='{$this->srcset('default')}' type='image/jpeg'>
<img class='{$imgclass}' alt='{$alt}' src='{$this->resize(900)->url()}' width='{$this->width()}' height='{$this->height()}' draggable='false'>
</picture>";
return $tag;
},
],
]);
{
"name": "scd/global-functions",
"description": "Global system functions for data handling",
"type": "kirby-plugin",
"license": "GNU",
"authors": [
{
"name": "scd, Santiago Duque",
"email": "sd@squareclouds.design"
}
],
"require": {
"getkirby/composer-installer": "^1.1"
}
}
panel.plugin('scd/panel-icons', {
icons: {
'layout-top': '<path d="M21 3C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H21ZM20 5H4V19H20V5ZM18 7V9H6V7H18Z" />',
'layout-bot': '<path d="M21 3C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H21ZM20 5H4V19H20V5ZM18 15V17H6V15H18Z" />',
'layout-mid': '<path d="M19 11V5H5V11H19ZM19 13H5V19H19V13ZM4 3H20C20.5523 3 21 3.44772 21 4V20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3Z" />',
}
});
\ No newline at end of file
<?php
Kirby::plugin('scd/panel-icons', [
'icons' => [
]
]);
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment