infra layout

_layouts/infra.html

+---
+layout: default
+---
+
+{% include site-header.html %}
+
+<main class="main container">
+<div class="content-up">
+    <article class="article--page  typeset">
+
+      {% if page.wikilink %}<p>Mehr infos findest du im <a href="{{page.wikilink}}">Wiki</a>.</p>{% endif %}
+
+  </article>
+  <h2>Informationen zur verfügbarkeit der Infrastrukturkomponente</h2>
+
+    {% assign tool =  page -%}
+    {% include {{site.loaninfo}}  %}
+
+
+      <div id="calendar"></div>
+    </div>
+</div>
+
+
+
+   </div>
+</main>
+
+{% include site-footer.html %}
+
+      <script src='{{ site.url }}/assets/fullcalendar/moment.min.js'></script>
+      <script src='{{ site.url }}/assets/fullcalendar/jquery.min.js'></script>
+      <script src='{{ site.url }}/assets/fullcalendar/ical.min.js'></script>
+      <script src='{{ site.url }}/assets/fullcalendar/fullcalendar.min.js'></script>
+      <script src='{{ site.url }}/assets/fullcalendar/de.js'></script>
+      <script>
+      $(document).ready(function() {
+        $('#calendar').fullCalendar({
+          header: {
+            left: 'prev,next today',
+            center: 'title',
+            right: 'month,agendaWeek,agendaDay,listMonth'
+          },
+          eventLimit: true, // allow "more" link when too many events
+          locale: "de",
+          navLinks: true,
+        });
+        {% assign realslug = page.url | split:'/' | last %}
+          $.get('{{ site.url }}/availability/{{realslug}}/availability.ics', function (res) {
+            var events = []
+            var parsed = ICAL.parse(res);
+            parsed[2].forEach(function(event) {
+              if (event[0] !== 'vevent') return
+              var data = {};
+              event[1].forEach(function(item){
+                data[item[0]] = item[3];
+              });
+              events.push({
+                title: data["summary"],
+                start: data["dtstart"],
+                end: data["dtend"],
+                url: data["url"],
+                location: data["location"]
+              });
+            });
+            e_source = {}
+            e_source['events'] = events;
+            e_source['id'] = 'holydays'
+            e_source['color']="{{device.calcolor}}"
+            $('#calendar').fullCalendar('addEventSource', e_source);
+          });
+        });
+</script>