fix: keep active page on config save, add Cyrillic preview support, fix grid sizing
- daemon.go: save/restore active page on config reload instead of always activating default_page (fixes page switch on save) - render.go: replace basicfont.Face7x13 with parseDisplayFace() for unicode/Cyrillic support in edit key preview - web.go: add SSE endpoint (GET /api/events) for real-time page_changed events and POST /api/activate-page API - app.js: persist active page via localStorage, listen for SSE page_changed events - styles.css, index.html: fix grid sizing (width 100%, minmax(0, 1fr), aspect-ratio on key buttons, max-width 525px)
This commit is contained in:
parent
52d4665e87
commit
b075b72eea
32
daemon.go
32
daemon.go
@ -74,6 +74,7 @@ func Run(ctx context.Context, cfg *config.Config, opts RunOptions) error {
|
||||
|
||||
web.SetDecks(decks)
|
||||
web.SetPageManager(primaryPM)
|
||||
web.SetExtraPageManagers(pageMgrs[1:])
|
||||
|
||||
for _, pm := range pageMgrs {
|
||||
if err := pm.ActivatePage(cfg.DefaultPage); err != nil {
|
||||
@ -104,14 +105,19 @@ func Run(ctx context.Context, cfg *config.Config, opts RunOptions) error {
|
||||
if a == nil {
|
||||
return
|
||||
}
|
||||
oldPage := primaryPM.ActivePageName()
|
||||
if err := ExecuteAction(a, primaryDeck, primaryPM); err != nil {
|
||||
slog.Error("execute action", "error", err)
|
||||
}
|
||||
if a.Type == "page" {
|
||||
asm.NotifyManualPage(a.Page)
|
||||
for _, pm := range pageMgrs[1:] {
|
||||
pm.ActivatePage(a.Page)
|
||||
newPage := primaryPM.ActivePageName()
|
||||
if newPage != oldPage {
|
||||
if a.Type == "page" {
|
||||
asm.NotifyManualPage(a.Page)
|
||||
}
|
||||
for _, pm := range pageMgrs[1:] {
|
||||
pm.ActivatePage(newPage)
|
||||
}
|
||||
web.BroadcastPageChange(newPage)
|
||||
}
|
||||
})
|
||||
|
||||
@ -191,6 +197,7 @@ func Run(ctx context.Context, cfg *config.Config, opts RunOptions) error {
|
||||
}
|
||||
pm.startPeriodicKeys()
|
||||
}
|
||||
web.BroadcastPageChange(page)
|
||||
}
|
||||
|
||||
case <-configTicker.C:
|
||||
@ -214,7 +221,9 @@ func Run(ctx context.Context, cfg *config.Config, opts RunOptions) error {
|
||||
for _, d := range decks {
|
||||
d.SetBrightness(deviceBrightness(cfg, d.Serial()))
|
||||
}
|
||||
var activePages []string
|
||||
for _, pm := range pageMgrs {
|
||||
activePages = append(activePages, pm.ActivePageName())
|
||||
pm.stopPeriodicKeys()
|
||||
pm.defaultFont = cfg.Font
|
||||
pm.LoadPages(cfg.Pages)
|
||||
@ -225,9 +234,18 @@ func Run(ctx context.Context, cfg *config.Config, opts RunOptions) error {
|
||||
detector = NewWindowDetector()
|
||||
windowCh, _ = detector.Start(ctx)
|
||||
}
|
||||
for _, pm := range pageMgrs {
|
||||
if err := pm.ActivatePage(cfg.DefaultPage); err != nil {
|
||||
slog.Warn("reload: activate default page", "error", err)
|
||||
for i, pm := range pageMgrs {
|
||||
page := cfg.DefaultPage
|
||||
if i < len(activePages) && activePages[i] != "" {
|
||||
for _, p := range cfg.Pages {
|
||||
if p.Name == activePages[i] {
|
||||
page = activePages[i]
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
if err := pm.ActivatePage(page); err != nil {
|
||||
slog.Warn("reload: activate page", "error", err)
|
||||
}
|
||||
pm.startPeriodicKeys()
|
||||
}
|
||||
|
||||
30
render.go
30
render.go
@ -42,7 +42,11 @@ func RenderKeyToImage(k *config.KeyConfig, keySize int) image.Image {
|
||||
}
|
||||
}
|
||||
if k.Label != "" {
|
||||
return composeImageWithLabel(img, k.Label, keySize)
|
||||
fontSize := 10.0
|
||||
if k.FontSize != nil {
|
||||
fontSize = *k.FontSize
|
||||
}
|
||||
return composeImageWithLabel(img, k.Label, keySize, fontSize)
|
||||
}
|
||||
g := gift.New(gift.Resize(keySize, keySize, gift.LanczosResampling))
|
||||
rgba := image.NewRGBA(image.Rect(0, 0, keySize, keySize))
|
||||
@ -62,7 +66,11 @@ func RenderKeyToImage(k *config.KeyConfig, keySize int) image.Image {
|
||||
return blankImage(keySize, bg)
|
||||
}
|
||||
}
|
||||
return renderTextImage(k.Label, keySize)
|
||||
fontSize := 12.0
|
||||
if k.FontSize != nil {
|
||||
fontSize = *k.FontSize
|
||||
}
|
||||
return renderTextImage(k.Label, keySize, fontSize)
|
||||
}
|
||||
|
||||
func blankImage(size int, c color.Color) image.Image {
|
||||
@ -71,7 +79,7 @@ func blankImage(size int, c color.Color) image.Image {
|
||||
return img
|
||||
}
|
||||
|
||||
func composeImageWithLabel(src image.Image, text string, keySize int) image.Image {
|
||||
func composeImageWithLabel(src image.Image, text string, keySize int, fontSize float64) image.Image {
|
||||
g := gift.New(gift.Resize(keySize, keySize, gift.LanczosResampling))
|
||||
rgba := image.NewRGBA(image.Rect(0, 0, keySize, keySize))
|
||||
g.Draw(rgba, src)
|
||||
@ -84,7 +92,12 @@ func composeImageWithLabel(src image.Image, text string, keySize int) image.Imag
|
||||
draw.Draw(rgba, barRect, &image.Uniform{color.RGBA{0, 0, 0, 180}}, image.Point{}, draw.Over)
|
||||
|
||||
if text != "" {
|
||||
face := basicfont.Face7x13
|
||||
face, err := parseDisplayFace(fontSize)
|
||||
if err != nil {
|
||||
face = basicfont.Face7x13
|
||||
} else {
|
||||
defer face.Close()
|
||||
}
|
||||
textW := font.MeasureString(face, text).Ceil()
|
||||
posX := (keySize - textW) / 2
|
||||
if posX < 2 {
|
||||
@ -107,11 +120,16 @@ func composeImageWithLabel(src image.Image, text string, keySize int) image.Imag
|
||||
return rgba
|
||||
}
|
||||
|
||||
func renderTextImage(text string, keySize int) image.Image {
|
||||
func renderTextImage(text string, keySize int, fontSize float64) image.Image {
|
||||
rgba := blankImage(keySize, color.RGBA{0, 0, 0, 255}).(*image.RGBA)
|
||||
|
||||
if text != "" {
|
||||
face := basicfont.Face7x13
|
||||
face, err := parseDisplayFace(fontSize)
|
||||
if err != nil {
|
||||
face = basicfont.Face7x13
|
||||
} else {
|
||||
defer face.Close()
|
||||
}
|
||||
textW := font.MeasureString(face, text).Ceil()
|
||||
posX := (keySize - textW) / 2
|
||||
if posX < 2 {
|
||||
|
||||
@ -51,6 +51,28 @@ document.addEventListener('alpine:init', () => {
|
||||
await this.loadConfig()
|
||||
await this.loadDecks()
|
||||
setInterval(() => this.pollDisplayOutputs(), 3000)
|
||||
this.connectSSE()
|
||||
},
|
||||
|
||||
connectSSE() {
|
||||
if (this._sse) this._sse.close()
|
||||
const es = new EventSource('/api/events')
|
||||
this._sse = es
|
||||
es.addEventListener('page_changed', (e) => {
|
||||
try {
|
||||
const data = JSON.parse(e.data)
|
||||
if (data.page && this.pages.find(p => p.name === data.page)) {
|
||||
this.activePage = data.page
|
||||
localStorage.setItem('sd_active_page', data.page)
|
||||
this.displayOutputs = {}
|
||||
}
|
||||
} catch (_) {}
|
||||
})
|
||||
es.onerror = () => {
|
||||
es.close()
|
||||
this._sse = null
|
||||
setTimeout(() => this.connectSSE(), 3000)
|
||||
}
|
||||
},
|
||||
|
||||
async loadDecks() {
|
||||
@ -79,7 +101,12 @@ document.addEventListener('alpine:init', () => {
|
||||
this.config = await res.json()
|
||||
this.pages = this.config.pages
|
||||
if (this.pages.length > 0) {
|
||||
this.activePage = this.config.default_page || this.pages[0].name
|
||||
const saved = localStorage.getItem('sd_active_page')
|
||||
if (saved && this.pages.find(p => p.name === saved)) {
|
||||
this.activePage = saved
|
||||
} else {
|
||||
this.activePage = this.config.default_page || this.pages[0].name
|
||||
}
|
||||
}
|
||||
this.syncSettings()
|
||||
} catch (e) {
|
||||
@ -460,7 +487,13 @@ document.addEventListener('alpine:init', () => {
|
||||
// ── Page management ──
|
||||
switchPage(name) {
|
||||
this.activePage = name
|
||||
localStorage.setItem('sd_active_page', name)
|
||||
this.displayOutputs = {}
|
||||
fetch('/api/activate-page', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ page: name })
|
||||
}).catch(() => {})
|
||||
},
|
||||
|
||||
async addPage() {
|
||||
|
||||
@ -14,7 +14,7 @@
|
||||
|
||||
<!-- ═══ Header ═══ -->
|
||||
<header>
|
||||
<button class="icon-btn" @click="subView = 'switcher'" title="Switch page">
|
||||
<button class="icon-btn" @click="view = 'grid'; subView = 'switcher'" title="Switch page">
|
||||
<i class="fas fa-layer-group"></i>
|
||||
</button>
|
||||
|
||||
@ -53,7 +53,7 @@
|
||||
x-text="d.model + ' (' + d.keys_x + '\u00d7' + d.keys_y + ')'"></button>
|
||||
</template>
|
||||
</div>
|
||||
<div class="deck-grid" :style="'grid-template-columns: repeat(' + activeDeck.keys_x + ', 1fr)'">
|
||||
<div class="deck-grid" :style="'grid-template-columns: repeat(' + activeDeck.keys_x + ', minmax(0, 1fr))'">
|
||||
<template x-for="key in gridKeys" :key="key.index">
|
||||
<button class="key-btn"
|
||||
:style="key.displayBg ? { backgroundColor: key.displayBg } : {}"
|
||||
@ -68,7 +68,7 @@
|
||||
<span x-show="key.configured && !key.background && !key.icon && key.label"
|
||||
style="font-size:12px;color:#fff;opacity:0.75;text-align:center;line-height:1.2;padding:4px;"
|
||||
x-text="key.label"></span>
|
||||
<span x-show="!key.configured" style="color:var(--text-muted);font-size:24px;opacity:0.5;">+</span>
|
||||
<span x-show="!key.configured" style="color:var(--text-muted);font-size:24px;opacity:0.5;line-height:1;">+</span>
|
||||
<div class="action-icons" x-show="key.hasAction">
|
||||
<template x-for="(t, ti) in key.actionTypes.slice(0,3)" :key="ti">
|
||||
<i :class="'fas fa-' + actionIconMap[t] + ' action-icon type-' + t"
|
||||
|
||||
@ -112,6 +112,9 @@ main {
|
||||
background: var(--surface);
|
||||
border-radius: var(--radius);
|
||||
border: 1px solid var(--border);
|
||||
width: 100%;
|
||||
max-width: 525px;
|
||||
contain: layout style;
|
||||
}
|
||||
|
||||
.deck-selector {
|
||||
@ -155,6 +158,8 @@ main {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
.key-btn:hover {
|
||||
@ -169,11 +174,10 @@ main {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
border-radius: inherit;
|
||||
}
|
||||
|
||||
.key-btn.empty {
|
||||
opacity: 0.3;
|
||||
border-color: var(--border-light);
|
||||
}
|
||||
.key-btn.empty:hover {
|
||||
opacity: 0.5;
|
||||
|
||||
104
web.go
104
web.go
@ -37,12 +37,20 @@ type WebServer struct {
|
||||
cfg *config.Config
|
||||
configPath string
|
||||
pm *PageManager
|
||||
extraPMs []*PageManager
|
||||
decks []*Deck
|
||||
mu sync.RWMutex
|
||||
|
||||
sseClients map[chan string]struct{}
|
||||
sseMu sync.RWMutex
|
||||
}
|
||||
|
||||
func NewWebServer(cfg *config.Config, configPath string) *WebServer {
|
||||
return &WebServer{cfg: cfg, configPath: configPath}
|
||||
return &WebServer{
|
||||
cfg: cfg,
|
||||
configPath: configPath,
|
||||
sseClients: make(map[chan string]struct{}),
|
||||
}
|
||||
}
|
||||
|
||||
func (s *WebServer) UpdateConfig(cfg *config.Config) {
|
||||
@ -63,6 +71,23 @@ func (s *WebServer) SetDecks(decks []*Deck) {
|
||||
s.decks = decks
|
||||
}
|
||||
|
||||
func (s *WebServer) SetExtraPageManagers(pms []*PageManager) {
|
||||
s.mu.Lock()
|
||||
defer s.mu.Unlock()
|
||||
s.extraPMs = pms
|
||||
}
|
||||
|
||||
func (s *WebServer) BroadcastPageChange(page string) {
|
||||
s.sseMu.RLock()
|
||||
defer s.sseMu.RUnlock()
|
||||
for ch := range s.sseClients {
|
||||
select {
|
||||
case ch <- page:
|
||||
default:
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
func (s *WebServer) Serve(ctx context.Context, addr string) error {
|
||||
mux := http.NewServeMux()
|
||||
|
||||
@ -86,6 +111,9 @@ func (s *WebServer) Serve(ctx context.Context, addr string) error {
|
||||
|
||||
mux.HandleFunc("GET /api/status", s.handleGetStatus)
|
||||
|
||||
mux.HandleFunc("GET /api/events", s.handleSSE)
|
||||
mux.HandleFunc("POST /api/activate-page", s.handleActivatePage)
|
||||
|
||||
mux.Handle("GET /static/", http.StripPrefix("/static/", http.FileServer(http.FS(staticRoot))))
|
||||
|
||||
mux.HandleFunc("/", s.handleSPA)
|
||||
@ -127,6 +155,80 @@ func (s *WebServer) handleSPA(w http.ResponseWriter, r *http.Request) {
|
||||
w.Write(data)
|
||||
}
|
||||
|
||||
func (s *WebServer) handleSSE(w http.ResponseWriter, r *http.Request) {
|
||||
flusher, ok := w.(http.Flusher)
|
||||
if !ok {
|
||||
http.Error(w, "streaming not supported", http.StatusInternalServerError)
|
||||
return
|
||||
}
|
||||
|
||||
w.Header().Set("Content-Type", "text/event-stream")
|
||||
w.Header().Set("Cache-Control", "no-cache")
|
||||
w.Header().Set("Connection", "keep-alive")
|
||||
|
||||
ch := make(chan string, 8)
|
||||
|
||||
s.sseMu.Lock()
|
||||
s.sseClients[ch] = struct{}{}
|
||||
s.sseMu.Unlock()
|
||||
|
||||
notify := r.Context().Done()
|
||||
go func() {
|
||||
<-notify
|
||||
s.sseMu.Lock()
|
||||
delete(s.sseClients, ch)
|
||||
s.sseMu.Unlock()
|
||||
}()
|
||||
|
||||
flusher.Flush()
|
||||
|
||||
for {
|
||||
select {
|
||||
case <-notify:
|
||||
return
|
||||
case page := <-ch:
|
||||
data, _ := json.Marshal(map[string]string{"page": page})
|
||||
fmt.Fprintf(w, "event: page_changed\ndata: %s\n\n", data)
|
||||
flusher.Flush()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
func (s *WebServer) handleActivatePage(w http.ResponseWriter, r *http.Request) {
|
||||
var req struct {
|
||||
Page string `json:"page"`
|
||||
}
|
||||
if err := json.NewDecoder(r.Body).Decode(&req); err != nil {
|
||||
http.Error(w, fmt.Sprintf("invalid JSON: %v", err), http.StatusBadRequest)
|
||||
return
|
||||
}
|
||||
if req.Page == "" {
|
||||
http.Error(w, "page is required", http.StatusBadRequest)
|
||||
return
|
||||
}
|
||||
|
||||
s.mu.RLock()
|
||||
allPMs := append([]*PageManager{s.pm}, s.extraPMs...)
|
||||
s.mu.RUnlock()
|
||||
|
||||
for _, pm := range allPMs {
|
||||
if pm == nil {
|
||||
continue
|
||||
}
|
||||
if err := pm.ActivatePage(req.Page); err != nil {
|
||||
slog.Warn("activate page", "page", req.Page, "error", err)
|
||||
} else {
|
||||
pm.stopPeriodicKeys()
|
||||
pm.startPeriodicKeys()
|
||||
}
|
||||
}
|
||||
|
||||
s.BroadcastPageChange(req.Page)
|
||||
|
||||
w.Header().Set("Content-Type", "application/json")
|
||||
json.NewEncoder(w).Encode(map[string]string{"status": "ok", "page": req.Page})
|
||||
}
|
||||
|
||||
func (s *WebServer) handleGetConfig(w http.ResponseWriter, r *http.Request) {
|
||||
s.mu.RLock()
|
||||
defer s.mu.RUnlock()
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user