add side boxes

master
Dirk Heilig 2024-01-08 21:25:56 +01:00
parent 39bbdaf967
commit 52a20de821
10 changed files with 134 additions and 4 deletions

View File

@ -17,6 +17,9 @@
{{ partial "side-categories.html" . }}
{{ partial "side-tags.html" . }}
*/}}
{{ partial "side-contact.html" . }}
{{ partial "side-calendar.html" . }}
{{ partial "side-door-status.html" . }}
</div>
</main>
{{ partial "footer.html" . }}

View File

@ -77,4 +77,7 @@
<link rel="stylesheet" href="{{ "css/syntax.css" | relURL }}" />
<link rel="stylesheet" href="{{ "css/style.css" | relURL }}" />
<link rel="shortcut icon" href="{{ "images/favicon.ico" | relURL }}" type="image/x-icon" />
<script src="/js/jquery-3.7.1.min.js"></script>
<script src="/js/layout.js"></script>
<script src="/js/door-status.js"></script>
<script src="/js/calendar.js"></script>

View File

@ -0,0 +1,7 @@
<div class="side-calendar">
<h2>Termine</h2>
<ul id="calendar"></ul>
</div>

View File

@ -0,0 +1,20 @@
<div class="side-contact">
<h2>Kontakt</h2>
<ul>
<li>
kontakt@c3re.de
</li>
<li>
<a href="https://matrix.to/#/#hackerhuette:matrix.c3re.de">Matrix Chat</a>
</li>
<li>
<a href="https://chaos.social/@c3re">Mastodon</a>
</li>
<li>
<a href="https://github.com/orgs/c3re">Github</a>
</li>
</ul>
</div>

View File

@ -0,0 +1,9 @@
<div class="side-door-status">
<h2>Doorstatus</h2>
<p><img src="" id="ds-img"></p>
<p>Aktueller Status: <span id="ds-status"></span></p>
<p>Status vom: <span id="ds-date"></span></p>
<p>Temperatur Clubraum: <span id="ds-temp"></span></p>
</div>

View File

@ -161,7 +161,10 @@ body {
.main,
.side-recent,
.side-categories,
.side-tags
.side-tags,
.side-calendar,
.side-door-status,
.side-contact
{
background-color: var(--color-bg-content);
}
@ -178,6 +181,9 @@ body {
margin-bottom: 0;
}
#calendar span{
display: block;
}
/********** set up break point **********/
@ -380,7 +386,7 @@ body {
.side a:hover { color: var(--color-fg-hyperlink); }
/* horizontally place tags */
.side .side-tags li { display: inline-block; margin: var(--len-1) var(--len-1); }
.side .side-tags li { margin: var(--len-1) var(--len-1); }
/*****************************/
/* set up single post layout */
@ -715,3 +721,8 @@ body {
padding: 0;
margin: 0;
}
#ds-img{
/* make image fit in div */
width: 100%;
}

View File

@ -0,0 +1,54 @@
document.addEventListener("DOMContentLoaded", function() {
let url="https://ical2json.c3re.de/api/?url=https%3A%2F%2Fcloud.c3re.de%2Fremote.php%2Fdav%2Fpublic-calendars%2FRLKKkdjNYgXH8yEz%3Fexport&start=today&end=next+month&maxitems=10"
let xmlHttp = new XMLHttpRequest();
let zeropad=function(i){
let o=""
if(i<=9) o+="0"
o+=i
return o
}
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4 && xmlHttp.status == 200){
let cal=JSON.parse(xmlHttp.responseText)
let $ = jQuery
let box=$('#calendar')
for(let item of cal){
let li=$("<li/>")
//li.text(item.summary)
let startDate=new Date(item.start * 1000)
let date=$("<span class='date'/>")
date.text(zeropad(startDate.getDate())+'.'+zeropad(1+startDate.getMonth())+'.'+startDate.getFullYear()+' - '+zeropad(startDate.getHours())+':'+zeropad(startDate.getMinutes()))
date.appendTo(li)
let summary=$("<span class='summary'/>")
summary.text(item.summary)
if(item.url){
let a = $('<a/>')
a.attr('href',item.url)
a.attr('title',item.description)
a.append(summary)
a.appendTo(li)
}else{
summary.appendTo(li)
}
if(item.location){
let loc=$("<span class='location'>📍</span>")
loc.attr('data-loc',item.location)
loc.attr('title',"Click to copy: "+item.location)
loc.appendTo(li)
}
li.attr('title',item.description)
li.appendTo(box)
console.log(item)
}
$(".location",box).click(function(){
navigator.clipboard.writeText($(this).attr('data-loc'))
})
}
}
xmlHttp.open("GET", url, true); // true for asynchronous
xmlHttp.send();
});

View File

@ -0,0 +1,22 @@
document.addEventListener("DOMContentLoaded", function() {
const update=function(){
fetch("https://spaceapi.c3re.de/").then(function(response) {
return( response.json());
}).then(function(data) {
console.log(data)
document.getElementById("ds-img").setAttribute("src",data.state.open?data.state.icon.open:data.state.icon.closed);
document.getElementById("ds-status").innerHTML=data.state.open?"Geöffnet":"Geschlossen";
document.getElementById("ds-temp").innerHTML=""+data.sensors.temperature[0].value+data.sensors.temperature[0].unit;
const lastchange=new Date(data.state.lastchange*1000)
document.getElementById('ds-date').innerHTML=lastchange.getDate().toString().padStart(2, "0") + "."
+ (lastchange.getMonth()+1).toString().padStart(2, "0") + "."
+ lastchange.getFullYear() + " "
+ lastchange.getHours().toString().padStart(2, "0") + ":"
+ lastchange.getMinutes().toString().padStart(2, "0")
})
}
update();
setInterval(update,10000);
});

File diff suppressed because one or more lines are too long

View File

@ -5,6 +5,5 @@ document.querySelectorAll('a[href^="http"]').forEach(function(element) {
const linkhost=new URL(element.href).hostname;
if(myhost === linkhost) return;
element.setAttribute("target","_blank");
console.log(element.attributes)
})
});