In order to provide another feature on the HABpanel, we have created a simple view on the class schedule for my kids.
Nothing fancy in OpenHAB as the HABpanel is loading a simple html file into a Frame.
The script itself is loading the data from a plain text file.
The current day of the week is highlighted.
<html>
<head>
<meta charset="UTF-8">
<script>
async function setStundenplan(plan){
const DEFAULT_PLAN_FILE = 'Stundenplan.txt';
// no plan set -> load default plan
if(!plan){
function excelPlanToJSArray(excelString) {
return excelString.split('\n').map(x => x.split('\t'));
}
let response = await fetch(DEFAULT_PLAN_FILE);
let text = await response.text();
plan = excelPlanToJSArray(text);
}
let day = new Date().getDay();
if(day>5) day = 0;
let domPlan = document.getElementById('stundenplan');
let headers = plan.shift();
let thead = document.createElement('tr');
headers.forEach((x,i)=>{
let th = document.createElement('th');
th.innerText = x;
if(i == day && day != 0) th.classList.add('activeDay');
thead.appendChild(th);
});
domPlan.appendChild(thead);
plan.forEach(row=>{
let tr = document.createElement('tr');
row.forEach((x,i) => {
let td = document.createElement('td');
td.innerText = x;
if (i == day && day != 0) td.classList.add('activeDay');
tr.appendChild(td);
});
domPlan.appendChild(tr);
});
}
// init stundenplan after load
window.addEventListener('load',_=>setStundenplan());
</script>
<style>
#stundenplan{
width: 100%;
border-collapse: collapse;
background-color: #ffffff;
font-size: 1.5rem;
}
#stundenplan th{
text-align: left;
background-color: #000000;
color: #ffffff;
}
#stundenplan tr:nth-child(odd){
background-color: rgba(0,0,0,0.2);
}
#stundenplan th, #stundenplan td{
padding: 0.5rem;
}
#stundenplan .activeDay{
background-color: rgba(0,0,0,0.1);
}
#stundenplan th.activeDay{
background-color: rgba(0,0,0,0.7);
}
</style>
</head>
<body>
<table id="stundenplan" />
</body>
</html>
The textfile looks like this:
Stunde Mo Di Mi Do Fr
7:40 - 8:40 Chemie Mathe Deutsch GL Mathe
8:45 - 9:45 Englisch Deutsch AWI Ergänzung AWI
10:05 - 11:05 Schwimmen GL Ergänzung Physik Musik
11:10 - 12:10 Latein Religion Latein Englisch Chemie
12:35 - 13:35 OA English OA OA Deutsch
13:15 - 14:15 GL Sport Mathe
14:20 - 15:20 AG AG
This is low profile but may be a useful application for others.