<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  spaceopen();
  bbbopen();
});

function spaceopen() {
  //http://nobreakspace.org/status/spaceapi.json

  $.get( "https://status.chaotikum.org/spaceapi.json", function( data ) {
    console.log(data);
    if(data.open) {
      console.log("OPEN");
      $("#spaceopen").css( "border", "3px solid green" );
      $("#spaceopen").html("<div style='float:left'><img src='{{ site.baseurl }}/assets/open.png' width='35'></div>Der Nbsp ist offen!<br><div style='text-align: right;'><a href='http://status.chaotikum.org/' target='_blank' style='color: #EAEAEA;'>Status</a></div>");
    } else {
      console.log("CLOSED");
      $("#spaceopen").css( "border", "3px solid red" );
      $("#spaceopen").html("<div style='float:left'><img src='{{ site.baseurl }}/assets/closed.png' width='35'></div>Der Nbsp ist geschlossen!<br><div style='text-align: right;'><a href='http://status.chaotikum.org/' target='_blank' style='color: #EAEAEA;'>Status</a></div>");
    }
  });
}

function bbbopen() {

    $.get( "https://plaudern.chaotikum.org/status", function( data ) {
        console.log(data);
        if(data.participantCount > 0) {
          console.log("OPEN");
          $("#cyberspaceopen").css( "border", "3px solid green" );
          $("#cyberspaceopen").html("<div style='float:left'><img src='{{ site.baseurl }}/assets/open.png' width='35'></div>Der Cyber-Space ist offen.<br><div style='text-align: right;'><a href='https://app.element.io/#/room/#nbsp:matrix.org' target='_blank' style='color: #EAEAEA;'>Schau Vorbei</a></div>");
        }  else {
          console.log("CLOSED");
          $("#cyberspaceopen").css( "border", "3px solid red" );
          $("#cyberspaceopen").html("<div style='float:left'><img src='{{ site.baseurl }}/assets/closed.png' width='35'></div>Derzeit ist niemand im Cyber-Space.<br><div style='text-align: right;'><a href='https://app.element.io/#/room/#nbsp:matrix.org' target='_blank' style='color: #EAEAEA;'>Matrix</a></div>");
        }
    });
}
</script>

<div id="spacehint">
  <b>Seit dem 2.11. ist der Nbsp geschlossen. Die <a href="https://chaotikum.org/verein/hygieneordnung/">Hygieneordnung des Chaotikum e.V.</a> ist einzuhalten.</b>
</div>
<br>
<div id="spaceopen">
  <!--Ob der Nobreakspace offen ist siehst du <a href='https://status.chaotikum.org/' target='_blank'>hier</a><p>Oder aktiviere Javascript</p>-->
</div>
<div id="cyberspaceopen">
  Ob jemand im BBB Chat des Nbsp ist siehst du <a href='https://plaudern.chaotikum.org/status' target='_blank'>hier</a>.<p>Oder aktiviere Javascript</p>
</div>