interaktionsweise/hippie
1
1
Fork 0
Code Issues Pull requests Releases 3 Activity Actions

feat: Update app and windows

Browse source 
- Move setAttributesAccordingToPosition to HippieTaskbar
- Use TimeDisplay inside HippieTaskbar
- Add readJsonFile and loadJson to app
- Initialize taskbar with config from data/windows.json
- Update jshint globals
This commit is contained in:
sthag 2026-04-05 14:20:14 +02:00
parent b67a8a893a
commit 0c16b43ec7
5 changed files with 102 additions and 48 deletions
Download patch file Download diff file Expand all files Collapse all files

33
source/code/windows.js
View file

@ -3,9 +3,10 @@ class HippieTaskBar {
this.element = element;
this.placeholder = placeholder;
this.date = null;
this.time = null;
this.isDragging = false;
this.barSize = '';
// TODO: Erweitern auf allgemeine Möglichkeiten und dann aus JSON-Datei laden
// TODO: Ergänzen und nicht ersetzen
this.options = options || {
direction: 0,
position: 'bottom',
@ -13,7 +14,8 @@ class HippieTaskBar {
year: 'numeric',
month: '2-digit',
day: '2-digit'
}
},
time: {hour: '2-digit', minute: '2-digit'}
};
this.init();
@ -25,11 +27,20 @@ class HippieTaskBar {
document.addEventListener('pointermove', this.onMove.bind(this));
document.addEventListener('pointerup', this.onUp.bind(this));
const clock = this.element.querySelector('.clock');
const dateElement = document.createElement('span');
const timeElement = document.createElement('span');
const br = document.createElement('br');
dateElement.id = 'date';
this.element.querySelector('.clock').appendChild(dateElement);
timeElement.id = 'time';
this.date = new DateDisplay(dateElement, this.options.date);
this.time = new TimeDisplay(timeElement, this.options.time);
// TODO: Reihenfolge anpassbar machen
clock.appendChild(timeElement);
clock.appendChild(br);
clock.appendChild(dateElement);
this.setOptions(this.options.position);
}
@ -111,7 +122,7 @@ class HippieTaskBar {
}
};
setAttributesAccordingToPosition(this.placeholder, this.options.position, attributes);
this.setAttributesAccordingToPosition(this.placeholder, this.options.position, attributes);
centerElementUnderCursor(event, this.placeholder);
}
}
@ -142,6 +153,18 @@ class HippieTaskBar {
this.date.changeFormat(this.options.date, this.options.direction);
}
setAttributesAccordingToPosition(element, position, attributes) {
element.classList.remove(...Object.values(attributes).map(pos => pos.className));
Object.keys(attributes[position].styles).forEach(key => {
element.style[key] = '';
});
element.classList.add(attributes[position].className);
Object.entries(attributes[position].styles).forEach(([key, value]) => {
element.style[key] = value;
});
}
setOptions(position) {
const attributes = {
top: {
@ -182,7 +205,7 @@ class HippieTaskBar {
}
};
setAttributesAccordingToPosition(this.element, position, attributes);
this.setAttributesAccordingToPosition(this.element, position, attributes);
switch (position) {
case 'right':