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

feat: Move element creation to #init() for HippieClock

Browse source
This commit is contained in:
sthag 2026-03-01 22:23:14 +01:00
parent a1aae6a902
commit c3de29d634
1 changed files with 8 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

14
source/screens/demo/examples/clock.liquid
View file

@ -33,13 +33,16 @@ tags:
sections: true, sections: true,
overlay: false overlay: false
}; };
this.parts = this.#createContext(['background', 'hands']); this.parts = [];
this.shapes = []; this.shapes = [];
this.#init(); this.#init();
} }
#init() { #init() {
this.#createContext(['background', 'hands']);
this.createOverlay();
this.addRing('seconds', 1, 21, 60, `rgb(250, 216, 3)`); this.addRing('seconds', 1, 21, 60, `rgb(250, 216, 3)`);
this.addRing('minutes', .9, 46, 60, `rgb(242, 175, 19)`); this.addRing('minutes', .9, 46, 60, `rgb(242, 175, 19)`);
this.addRing('hours', .8, 6, this.options.h24 ? 24 : 12, `rgb(211, 10, 81)`); this.addRing('hours', .8, 6, this.options.h24 ? 24 : 12, `rgb(211, 10, 81)`);
@ -309,13 +312,11 @@ tags:
canvas.width = canvas.offsetWidth; canvas.width = canvas.offsetWidth;
wrap.appendChild(canvas); wrap.appendChild(canvas);
parts.push({name: name, element: canvas, context: canvas.getContext('2d')}); this.parts.push({name: name, element: canvas, context: canvas.getContext('2d')});
}); });
this.element.appendChild(wrap); this.element.appendChild(wrap);
parts.push({name: 'wrap', element: wrap}); this.parts.push({name: 'wrap', element: wrap});
return parts;
} }
createOverlay() { createOverlay() {
@ -334,7 +335,8 @@ tags:
left: '0px', left: '0px',
height: '100%', height: '100%',
width: '100%', width: '100%',
// display: this.options.overlay ? 'flex' : 'none', display: this.options.overlay ? 'flex' : 'none',
// display: 'flex',
justifyContent: 'center', justifyContent: 'center',
alignItems: 'center', alignItems: 'center',
backgroundColor: `rgba(0, 0, 0, .6)`, backgroundColor: `rgba(0, 0, 0, .6)`,