device.html

---
layout: default
---

{% include site-header.html %}

<main class="main container">
<div class="content-up">
    <article class="article--page  typeset">

      <div class="not-in-print">
      <h4 id="{{page.uid}}">{{page.name}}</h4>
      </div>

      <div class="only-in-print">
        <img style="float: right; height: 50px; padding-top: 20px; padding-right: 10px;" src="{{ site.url }}/assets/logo.png">
        <div style="
          width: 125%;
          margin: auto;
          background-color: #FFA500;
          text-align:center;
          padding-top: 20px;
          padding-left: 72px;
          padding-right: 72px;
          margin-left: -120px;">
          <h1 style="color: white">{{page.name}}</h1>
        </div>
      </div>

      {% if page.safetybriefing -%}
        {% assign tuid = page.uid %}
        {% include {{site.einweisung}} tuid=tuid%}
      {% endif -%}

      {% for briefing in site.briefing -%}
        {% if briefing.inventory_id == page.uid -%}
          <div class="only-in-print" style="min-height: {{briefing.size-on-poster}}px; max-height: {{briefing.size-on-poster}}px; overflow: hidden;">
            <div class="two-columns poster-font" style="overflow: hidden;">
              {{ briefing.excerpt | markdownify }}
            </div>
          </div>
        {% endif -%}
      {% endfor -%}

      {% if page.contact -%}
      Ansprechpersonen:
      <div class="toolcontact" id="toolcontact">
          <ul>
          {% for con in page.contact -%}
              <li>{% include entity.html -%}</li>
          {% endfor -%}
        </ul>
      </div>
      {% endif -%}

      <div class="not-in-print">
      {% if page.manual -%}
        <img src="{{ site.url }}/assets/iso7010/M002.svg" alt="{{c}}" style="height: 1em"> <a href="{{page.manual}}">Bedienungsanleitung</a>
      {% endif -%}

      <p> {{page.content}}</p>

      {%- if page.imagetag -%} {%- include {{site.gallery}} topic=page.imagetag -%} {%- endif -%}
      {% if page.wikilink %}<p>Mehr infos findest du im <a href="{{page.wikilink}}">Wiki</a>.</p>{% endif %}
      </div>

      <div style="
        margin: auto;
       background-color: #fafafa;
       border: 10px solid;
       border-color: #e67206;
       padding: 10px 25px;
       max-width:100%;
       font-family:sans-serif;
       overflow: hidden;">
        <h4 style="font-family:sans-serif;">{{page.name}}</h4>
          <ul style="list-style-type:none;">
          {% for hint in page.hints -%}<li>{{hint}}</li>{% endfor -%}
          </ul>
          <p style="text-align:center;margin:0">
          {% for c in page.commandsigns -%}
            <a href="https://de.wikipedia.org/wiki/Gebotszeichen" target="_blank" style="background-image:none;"><img src="{{ site.url }}/assets/iso7010/{{c}}.svg" alt="{{c}}" width="100"></a>
          {% endfor -%}</p>
          <div class="not-in-print">
            {% if page.safetybriefing -%}
              <div style=" margin:5px 0; width: 100%; min-height: 40pt; ">
                <span style="float: left; color: #e67206; font-size: 40pt; display:block; width: 50pt; height: 40pt; text-align:center; line-height: 40pt;">⚠</span><p style="vertical-align: middle;">Um dieses Gerät benutzen zu dürfen benötigst du eine <a href="{{ site.baseurl }}{{ page.url }}briefing/">Einweisung</a>!</p>
              </div>
            {% endif -%}
          </div>

          <div class="url-for-print" style="float: left; margin-bottom:0px;">
            <div id="qrcode" style="width: 150px;">
            </div>
            <p><a href="{{ site.url }}{{ page.url }}">chaotikum.org</a></p>
          </div>

          {% if page.safetybriefing -%}
          <div class="url-for-print" style="float: right; margin-bottom:0px;">
            <div id="qrcode2" style="width: 150px;">
            </div>
            <p>Sicherheitseinweisung</p>
          </div>
          {% endif -%}

          {% if page.manual -%}
          <div class="url-for-print" style="float: right; margin-left: 10px; margin-bottom:0px;">
            <div id="qrcode3" style="width: 150px;">
            </div>
            <p>Bedienungsanleitung</p>
          </div>
          {% endif -%}

        </div>

         <div class="not-in-print">
          <p>Schadensmeldungen:</p>
          <ul>
            {% for damagereport in site.damagereport -%}
              {% if damagereport.device_uid == page.uid -%}
                <li><b>{{ damagereport.date | date: '%d.%m.%Y' }}: </b>: {{damagereport.content}}</li>
              {% endif -%}
            {% endfor -%}
          </ul>
         <div>

       </div>
      </article>
<div class="not-in-print">
<h2>Spendenempfehlung</h2>
{% for drec in site.donationrecommendation -%}
  {% if drec.device_uid == page.uid -%}
      {{drec.content}}
  {% endif -%}
{% endfor -%}
</div>
<div class="not-in-print">
<h2>Informationen zur verfügbarkeit des Geräts</h2>

  {% assign tool =  page -%}
  {% include {{site.loaninfo}}  %}


    <div id="calendar"></div>
    </div>
  </div>



   </div>
</main>

{% include site-footer.html %}

      <script type="text/javascript">
        new QRCode(document.getElementById("qrcode"), {text: "{{ site.url }}{{ page.url }}", width: 128, height: 128});
      </script>

      <script type="text/javascript">
        new QRCode(document.getElementById("qrcode2"), {text: "{{ site.url }}{{ page.url }}briefing/", width: 128, height: 128});
      </script>

      <script type="text/javascript">
        new QRCode(document.getElementById("qrcode3"), {text: "{{ page.manual }}", width: 128, height: 128});
      </script>

      <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>