<!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/core@latest/dist/static-cms-core.min.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',
        },
      });
      
      
    </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 h1"},
                        h('a', {"className": "text-primary font-secondary", href: ""}, "Schulchronik")),
                      h('li', {"className": "list-inline-item ha"},
                        h("i", {"className": "fa-solid fa-angle-right text-white"})),
                      h('li', {"className": "list-inline-item text-white h1 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);

</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 h1"},
                          h('a', {"className": "text-primary font-secondary", href: ""}, "Startseite")
                        ),
                        h('li', {"className": "list-inline-item ha"},
                          h("i", {"className": "fa-solid fa-angle-right text-white"})
                        ),
                        h('li', {"className": "list-inline-item text-white h1 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"},
                                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("contact-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);

</script>

  </body>
</html>