429 lines
18 KiB
HTML
429 lines
18 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<link rel="stylesheet" href="https://cantorgymnasium.de/plugins/fontawesome/css/all.css">
|
|
<title>Content Manager</title>
|
|
</head>
|
|
<body>
|
|
<!-- Include the script that builds the page and powers Static CMS -->
|
|
<script src="https://cdn.jsdelivr.net/npm/@staticcms/app@latest/dist/static-cms-app.js"></script>
|
|
<script>
|
|
window.CMS.init();
|
|
CMS.registerIcon('home', ({}) => { return(h('i', {"className": "fa fa-house"})); });
|
|
CMS.registerIcon('settings', ({}) => { return(h('i', {"className": "fa fa-gear"})); });
|
|
CMS.registerIcon('user', ({}) => { return(h('i', {"className": "fa fa-user"})); });
|
|
CMS.registerIcon('page', ({}) => { return(h('i', {"className": "fa fa-file"})); });
|
|
CMS.registerIcon('document', ({}) => { return(h('i', {"className": "fa fa-file-lines"})); });
|
|
CMS.registerIcon('news', ({}) => { return(h('i', {"className": "fa fa-newspaper"})); });
|
|
CMS.registerIcon('award', ({}) => { return(h('i', {"className": "fa fa-award"})); });
|
|
CMS.registerIcon('group', ({}) => { return(h('i', {"className": "fa fa-people-group"})); });
|
|
CMS.registerIcon('trophy', ({}) => { return(h('i', {"className": "fa fa-trophy"})); });
|
|
CMS.registerIcon('book', ({}) => { return(h('i', {"className": "fa fa-book"})); });
|
|
CMS.registerIcon('timeline', ({}) => { return(h('i', {"className": "fa fa-timeline"})); });
|
|
CMS.registerIcon('graduation-cap', ({}) => { return(h('i', {"className": "fa fa-graduation-cap"})); });
|
|
CMS.registerIcon('info', ({}) => { return(h('i', {"className": "fa fa-circle-info"})); });
|
|
const CustomPage = () => {
|
|
return h('div', {}, 'I am a custom page!');
|
|
};
|
|
|
|
CMS.registerAdditionalLink({
|
|
id: 'info',
|
|
title: 'Informationen',
|
|
data: CustomPage,
|
|
options: {
|
|
icon: 'info',
|
|
},
|
|
});
|
|
CMS.registerShortcode('gallery', {
|
|
label: 'Gallery',
|
|
openTag: '{{< ',
|
|
closeTag: ' />}}',
|
|
separator: ' ',
|
|
toProps: args => {
|
|
if (args.length > 0) {
|
|
var dir = args.find(arg => arg.startsWith('dir='))?.split('=')[1].replaceAll("\"","") ?? '';
|
|
console.log(dir);
|
|
return { dir: dir };
|
|
}
|
|
|
|
return { dir: '' };
|
|
},
|
|
toArgs: ({ dir }) => {
|
|
return [`dir=\"${dir}\"`];
|
|
},
|
|
control: ({ dir, onChange }) => {
|
|
return h('div', {"className": "row", "style": { border: "1px solid #ccc", borderRadius: "16px", padding: "10px" }},
|
|
h('b', {}, "Gallerie-Ordner: "),
|
|
h('input', {
|
|
key: 'control-input',
|
|
value: dir,
|
|
onChange: event => {
|
|
onChange({ dir: event.target.value });
|
|
},
|
|
}));
|
|
},
|
|
preview: ({ dir }) => {
|
|
return h('div', {"className": "row", "style": { border: "1px solid #ccc", borderRadius: "16px", padding: "10px" }},
|
|
h('b', {"style": { marginRight: "5px" }}, "Gallerie-Ordner:"),
|
|
h('code', {}, dir));
|
|
},
|
|
});
|
|
CMS.registerShortcode('load-photoswipe', {
|
|
label: 'Gallerie-Servicemodul',
|
|
openTag: '{{< ',
|
|
closeTag: ' >}}',
|
|
separator: '',
|
|
toProps: args => {
|
|
},
|
|
toArgs: () => {
|
|
},
|
|
control: () => {
|
|
return h('div', {"className": "row", "style": { border: "1px solid #ccc", borderRadius: "16px", padding: "10px" }},
|
|
h('b', {}, "Gallerie-Servicemodul"));
|
|
},
|
|
preview: () => {
|
|
|
|
},
|
|
});
|
|
|
|
</script>
|
|
<script>
|
|
const CategoriesControl = ({ label, value, field, onChange }) => {
|
|
const separator = useMemo(() => field.separator ?? ', ', [field.separator]);
|
|
|
|
const handleChange = useCallback((e) => {
|
|
onChange(e.target.value.split(separator).map(e => e.trim()));
|
|
}, [separator, onChange]);
|
|
|
|
return h('div', {},
|
|
h('label', { for: 'inputId' }, label),
|
|
h('input', {
|
|
id: 'inputId',
|
|
type: 'text',
|
|
value: value ? value.join(separator) : '',
|
|
onChange: this.handleChange,
|
|
})
|
|
);
|
|
};
|
|
|
|
const CategoriesPreview = ({ value }) => {
|
|
return h(
|
|
'ul',
|
|
{},
|
|
value.map(function (val, index) {
|
|
return h('li', { key: index }, val);
|
|
}),
|
|
);
|
|
};
|
|
|
|
const schema = {
|
|
properties: {
|
|
separator: { type: 'string' },
|
|
},
|
|
};
|
|
|
|
CMS.registerWidget('categories', CategoriesControl, CategoriesPreview, schema);
|
|
</script>
|
|
<script>
|
|
CMS.registerPreviewStyle("https://cantorgymnasium.de/plugins/bootstrap/bootstrap.min.css");
|
|
CMS.registerPreviewStyle("https://cantorgymnasium.de/plugins/slick/slick.css");
|
|
CMS.registerPreviewStyle("https://cantorgymnasium.de/plugins/animate/animate.css");
|
|
CMS.registerPreviewStyle("https://cantorgymnasium.de/plugins/venobox/venobox.css");
|
|
CMS.registerPreviewStyle("https://cantorgymnasium.de/plugins/fontawesome/css/all.css");
|
|
CMS.registerPreviewStyle("https://cantorgymnasium.de/plugins/fira/fira.css");
|
|
CMS.registerPreviewStyle("https://cantorgymnasium.de/scss/style.css");
|
|
</script>
|
|
<script>
|
|
var ChronikPreview = ({widgetFor, entry }) => {
|
|
const divStyle = {
|
|
backgroundImage: 'url("/media/backgrounds/page-title.png"),url("/media/backgrounds/page-title.png")',
|
|
};
|
|
return h('div', {},
|
|
h('section', {"className": "page-title-section overlay", "style": divStyle},
|
|
h('div', {"className": "container"},
|
|
h('div', {"className": "col-md-8"},
|
|
h('ul', {"className": "list-inline custom-breadcrumb"},
|
|
h('li', {"className": "list-inline-item h2"},
|
|
h('a', {"className": "text-primary font-secondary", href: ""}, "Schulchronik")),
|
|
h('li', {"className": "list-inline-item h2"},
|
|
h("i", {"className": "fa-solid fa-angle-right text-white"})),
|
|
h('li', {"className": "list-inline-item text-white h2 font-secondary"}, entry.data.title)
|
|
)
|
|
)
|
|
)
|
|
),
|
|
h('section', {"className": "section-sm"},
|
|
h('div', {"className": "container"},
|
|
h('div', {"className": "row"},
|
|
h('div', {"className": "col-12 mb-4 content"}, widgetFor('body'))
|
|
)
|
|
)
|
|
)
|
|
);
|
|
};
|
|
|
|
CMS.registerPreviewTemplate("schulchronik", ChronikPreview);
|
|
|
|
</script>
|
|
<script>
|
|
var PostPreviewContent = ({widgetFor, entry}) => {
|
|
const divStyle = {
|
|
backgroundImage: 'url("/media/backgrounds/page-title.png"),url("/media/backgrounds/page-title.png")',
|
|
};
|
|
return h('div', {},
|
|
h('section', {"className": "page-title-section overlay", "style": divStyle},
|
|
h('div', {"className": "container"},
|
|
h('div', {"className": "col-md-8"},
|
|
h('ul', {"className": "list-inline custom-breadcrumb"},
|
|
h('li', {"className": "list-inline-item h2"},
|
|
h('a', {"className": "text-primary font-secondary", href: ""}, "Startseite")),
|
|
h('li', {"className": "list-inline-item h2"},
|
|
h("i", {"className": "fa-solid fa-angle-right text-white"})),
|
|
h('li', {"className": "list-inline-item text-white h2 font-secondary"}, entry.data.title)
|
|
),
|
|
h('p', {"className": "text-lighten"}, entry.data.description
|
|
)
|
|
)
|
|
)
|
|
),
|
|
h('section', {"className": "section-sm"},
|
|
h('div', {"className": "container"},
|
|
h('div', {"className": "row"},
|
|
h('div', {"className": "col-12 mb-4"},
|
|
h('div', {"className": "content"}, widgetFor('body'))
|
|
)
|
|
)
|
|
)
|
|
)
|
|
);
|
|
};
|
|
|
|
CMS.registerPreviewTemplate("impressum", PostPreviewContent);
|
|
CMS.registerPreviewTemplate("datenschutz", PostPreviewContent);
|
|
CMS.registerPreviewTemplate("schuelerrat-geschaeftsordnung", PostPreviewContent);
|
|
CMS.registerPreviewTemplate("schuelervertretung-index", PostPreviewContent);
|
|
CMS.registerPreviewTemplate("elternvertretung-index", PostPreviewContent);
|
|
CMS.registerPreviewTemplate("jia-index", PostPreviewContent);
|
|
CMS.registerPreviewTemplate("bibo", PostPreviewContent);
|
|
CMS.registerPreviewTemplate("abiturienten", PostPreviewContent);
|
|
CMS.registerPreviewTemplate("cantorfora", PostPreviewContent);
|
|
CMS.registerPreviewTemplate("contact-index", PostPreviewContent);
|
|
|
|
</script>
|
|
<script>
|
|
var AnmeldungPreviewContent = ({widgetsFor, widgetFor, entry}) => {
|
|
const divStyle = {
|
|
backgroundImage: 'url("/media/backgrounds/page-title.png"),url("/media/backgrounds/page-title.png")',
|
|
};
|
|
return h('div', {},
|
|
h('section', {"className": "page-title-section overlay", "style": divStyle},
|
|
h('div', {"className": "container"},
|
|
h('div', {"className": "col-md-8"},
|
|
h('ul', {"className": "list-inline custom-breadcrumb"},
|
|
h('li', {"className": "list-inline-item h2"},
|
|
h('a', {"className": "text-primary font-secondary", href: ""}, "Startseite")),
|
|
h('li', {"className": "list-inline-item h2"},
|
|
h("i", {"className": "fa-solid fa-angle-right text-white"})),
|
|
h('li', {"className": "list-inline-item text-white h2 font-secondary"}, entry.data.title)
|
|
),
|
|
h('p', {"className": "text-lighten"}, entry.data.description
|
|
)
|
|
)
|
|
)
|
|
),
|
|
h('section', {"className": "section-sm"},
|
|
h('div', {"className": "container"},
|
|
h('div', {"className": "row mb-5"},
|
|
h('div', {"className": "col-md-6 content"},
|
|
widgetFor('body')
|
|
)
|
|
),
|
|
h('div', {"className": "row"},
|
|
widgetsFor('elements').map(function(element, index) {
|
|
return h('div', {"className": "col-lg-4 col-sm-6 mb-4"},
|
|
h('div', {"className": "card rounded-0 hover-shadow border-top-0 border-left-0 border-right-0"},
|
|
h('div', {"className": "card-body"},
|
|
h('h4', {"className": "card-title mb-3"},
|
|
element.data.title
|
|
),
|
|
h('div', {"className": "content"},
|
|
element.widgets.content
|
|
)
|
|
)
|
|
)
|
|
);
|
|
})
|
|
)
|
|
)
|
|
),
|
|
);
|
|
};
|
|
|
|
|
|
CMS.registerPreviewTemplate("anmeldung-index", AnmeldungPreviewContent);
|
|
|
|
|
|
</script>
|
|
<script>
|
|
var EventPreview = ({widgetsFor, entry}) => {
|
|
const divStyle = {
|
|
backgroundImage: 'url("/media/backgrounds/page-title.png"),url("/media/backgrounds/page-title.png")',
|
|
};
|
|
return h('div', {},
|
|
h('section', {"className": "page-title-section overlay", "style": divStyle},
|
|
h('div', {"className": "row"},
|
|
h('div', {"className": "container"},
|
|
h('div', {"className": "col-md-8"},
|
|
h('ul', {"className": "list-inline custom-breadcrumb"},
|
|
h('li', {"className": "list-inline-item h2"},
|
|
h('a', {"className": "text-primary font-secondary", href: ""}, "Startseite")
|
|
),
|
|
h('li', {"className": "list-inline-item h2"},
|
|
h("i", {"className": "fa-solid fa-angle-right text-white"})
|
|
),
|
|
h('li', {"className": "list-inline-item text-white h2 font-secondary"}, entry.data.title
|
|
)
|
|
),
|
|
h('p', {"className": "text-lighten"}, entry.data.description)
|
|
)
|
|
)
|
|
)
|
|
),
|
|
h('section', {"className": "section"},
|
|
h('div', {"className": "container"},
|
|
h('div', {"className": "row"},
|
|
h('div', {"className": "col-12 "},
|
|
h('ul', {"className": "list-unstyled"},
|
|
widgetsFor('events').map(function(event, index) {
|
|
console.log(event.data.date);
|
|
return h('li', {"className": "d-md-table mb-4 w-100 border-bottom hover-shadow"},
|
|
h('div', {"className": "d-md-table-cell text-center p-4 bg-primary text-white mb-4 mb-md-0 termin-tc"},
|
|
h('span', {"className": "h2 d-block"}, new Intl.DateTimeFormat('de-De', { day: 'numeric'}).format(new Date(event.data.date))),
|
|
new Intl.DateTimeFormat('de-De', { month: 'short', year: 'numeric' }).format(new Date(event.data.date))
|
|
),
|
|
h('div', {"className": "d-md-table-cell px-4 vertical-alighn-middle mb-4 mb-md-0"},
|
|
h('p', {"className": "h4 mb-3 d-block"}, event.data.title),
|
|
h('p', {"className": "mb-0"}, event.data.summary)
|
|
),
|
|
h('div', {"className": "d-md-table-cell text-right pr-0 pr-md-4"},
|
|
h('p', {},
|
|
h('i', {"className": "fa-solid fa-location-dot text-primary mr-2"}),
|
|
event.data.location
|
|
)
|
|
)
|
|
);
|
|
})
|
|
)
|
|
)
|
|
)
|
|
)
|
|
)
|
|
);
|
|
};
|
|
|
|
CMS.registerPreviewTemplate("event-index", EventPreview);
|
|
|
|
</script>
|
|
<script>
|
|
var PagePreview = ({widgetFor, entry}) => {
|
|
const divStyle = {
|
|
backgroundImage: 'url("/media/backgrounds/page-title.png"),url("/media/backgrounds/page-title.png")',
|
|
};
|
|
return h('div', {},
|
|
h('section', {"className": "page-title-section overlay", "style": divStyle},
|
|
h('div', {"className": "row"},
|
|
h('div', {"className": "container"},
|
|
h('div', {"className": "col-md-8"},
|
|
h('ul', {"className": "list-inline custom-breadcrumb"},
|
|
h('li', {"className": "list-inline-item h2"},
|
|
h('a', {"className": "text-primary font-secondary", href: ""}, "Startseite")
|
|
),
|
|
h('li', {"className": "list-inline-item h2"},
|
|
h("i", {"className": "fa-solid fa-angle-right text-white"})
|
|
),
|
|
h('li', {"className": "list-inline-item text-white h2 font-secondary"}, entry.data.title
|
|
)
|
|
),
|
|
h('p', {"className": "text-lighten"}, entry.data.description)
|
|
)
|
|
)
|
|
)
|
|
)
|
|
);
|
|
};
|
|
|
|
CMS.registerPreviewTemplate("blog-index", PagePreview);
|
|
CMS.registerPreviewTemplate("cantorpreis-index", PagePreview);
|
|
CMS.registerPreviewTemplate("forms-index", PagePreview);
|
|
CMS.registerPreviewTemplate("ganztagsangebote-index", PagePreview);
|
|
CMS.registerPreviewTemplate("wettbewerbe-index", PagePreview);
|
|
CMS.registerPreviewTemplate("begabtenfoerderung-index", PagePreview);
|
|
|
|
</script>
|
|
<script>
|
|
var PagePreviewImage = ({ widgetFor, getAsset, entry}) => {
|
|
const [imageUrl, setImageUrl] = useState('');
|
|
const image = useMemo(() => entry.data.image, [entry.data.image]);
|
|
|
|
useEffect(() => {
|
|
let alive = true;
|
|
|
|
const loadImage = async () => {
|
|
const imageAsset = await getAsset(image);
|
|
if (alive) {
|
|
setImageUrl(imageAsset.toString());
|
|
}
|
|
};
|
|
|
|
loadImage();
|
|
|
|
return () => {
|
|
alive = false;
|
|
};
|
|
}, [image]);
|
|
|
|
const divStyle = {
|
|
backgroundImage: 'url("/media/backgrounds/page-title.png"),url("/media/backgrounds/page-title.png")',
|
|
};
|
|
return h('div', {},
|
|
h('section', {"className": "page-title-section overlay", "style": divStyle},
|
|
h('div', {"className": "row"},
|
|
h('div', {"className": "container"},
|
|
h('div', {"className": "col-md-8"},
|
|
h('ul', {"className": "list-inline custom-breadcrumb"},
|
|
h('li', {"className": "list-inline-item h2"},
|
|
h('a', {"className": "text-primary font-secondary", href: ""}, "Startseite")
|
|
),
|
|
h('li', {"className": "list-inline-item h2"},
|
|
h("i", {"className": "fa-solid fa-angle-right text-white"})
|
|
),
|
|
h('li', {"className": "list-inline-item text-white h2 font-secondary"}, entry.data.title
|
|
)
|
|
),
|
|
h('p', {"className": "text-lighten"}, entry.data.description
|
|
))
|
|
)
|
|
)
|
|
),
|
|
h('section', {"className": "section-sm"},
|
|
h('div', {"className": "container"},
|
|
h('div', {"className": "row"},
|
|
h('div', {"className": "col-12 mb-4"},
|
|
h('img', {"className": "img-fluid w-100 mb-4", src: imageUrl}),
|
|
widgetFor('body'))
|
|
)
|
|
)
|
|
)
|
|
);
|
|
};
|
|
|
|
CMS.registerPreviewTemplate("about-index", PagePreviewImage);
|
|
CMS.registerPreviewTemplate("blog", PagePreviewImage);
|
|
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|