Add Legacy panel mode, keyboard navigation and fixed recording issues. (#293)
This commit is contained in:
+415
-142
@@ -11,9 +11,17 @@
|
||||
-- state channel. Capture tools close the panel first so the capture never
|
||||
-- includes it.
|
||||
|
||||
local activeView = "main"
|
||||
local recordAudioOut = (noctalia.getConfig("record-audio-out") == true)
|
||||
local recordAudioIn = false
|
||||
local hoveredAudioIn = false
|
||||
local hoveredAudioOut = false
|
||||
local hoveredBack = false
|
||||
|
||||
local panelOpen = false
|
||||
local recording = noctalia.state.get("recording") == true
|
||||
local hoveredTool = nil
|
||||
local focusedTool local focusedIndex = 0
|
||||
local hoveredClose = false
|
||||
local hoveredStop = false
|
||||
local render
|
||||
@@ -29,36 +37,48 @@ local function send(action, payload)
|
||||
noctalia.state.set("command", { action = action, payload = payload })
|
||||
end
|
||||
|
||||
local function shellQuote(value)
|
||||
return "'" .. tostring(value):gsub("'", [["'"']]) .. "'"
|
||||
end
|
||||
|
||||
local function getMode()
|
||||
return noctalia.getConfig("panel-mode") == "full" and "full" or "compact"
|
||||
local mode = noctalia.getConfig("panel-mode")
|
||||
if mode == "full" or mode == "compact" or mode == "legacy" then return mode end
|
||||
return "full"
|
||||
end
|
||||
|
||||
-- Capture tools must not see the panel in the frame, so close it first.
|
||||
local CAPTURE_ACTIONS = {
|
||||
colorPicker = true,
|
||||
ocr = true,
|
||||
qr = true,
|
||||
palette = true,
|
||||
lens = true,
|
||||
measure = true,
|
||||
annotate = true,
|
||||
annotateFullscreen = true,
|
||||
annotateWindow = true,
|
||||
record = true,
|
||||
recordMp4 = true,
|
||||
recordFullscreen = true,
|
||||
recordFullscreenMp4 = true,
|
||||
colorPicker = true, ocr = true, qr = true, palette = true, lens = true, measure = true,
|
||||
annotate = true, annotateFullscreen = true, annotateWindow = true,
|
||||
record = true, recordMp4 = true, recordFullscreen = true, recordFullscreenMp4 = true,
|
||||
}
|
||||
|
||||
local function runTool(action)
|
||||
if CAPTURE_ACTIONS[action] then
|
||||
panel.close()
|
||||
end
|
||||
if action == "record" or action == "recordFullscreen" then noctalia.state.set("recordFormat", "gif")
|
||||
elseif action == "recordMp4" or action == "recordFullscreenMp4" then noctalia.state.set("recordFormat", "mp4") end
|
||||
if CAPTURE_ACTIONS[action] then panel.close() end
|
||||
send(action)
|
||||
end
|
||||
|
||||
-- ── Tool data ──────────────────────────────────────────────────────────────
|
||||
local RECORD_THUMB = "/tmp/screen-toolkit-record-thumb.png"
|
||||
local ANNOTATE_THUMB = "/tmp/screen-toolkit-annotate.png"
|
||||
local lastCapturePath, lastRecordPath = nil, nil
|
||||
|
||||
local function refreshPreview()
|
||||
local annotateResult = noctalia.state.get("annotateResult")
|
||||
local recordPath = noctalia.state.get("recordPath")
|
||||
if annotateResult and type(annotateResult) == "table" and annotateResult.capturePath and annotateResult.capturePath ~= "" then
|
||||
lastCapturePath = annotateResult.capturePath
|
||||
elseif noctalia.fileExists and noctalia.fileExists(ANNOTATE_THUMB) then
|
||||
lastCapturePath = ANNOTATE_THUMB
|
||||
end
|
||||
if recordPath and type(recordPath) == "string" and recordPath ~= "" then lastRecordPath = recordPath end
|
||||
end
|
||||
|
||||
-- ── Tool data ──────────────────────────────────────────────────────────────
|
||||
|
||||
-- For Compact-mode and Full-mode layouts
|
||||
local TOOLS = {
|
||||
{ action = "colorPicker", label_key = "tools.colorpicker", glyph = "palette" },
|
||||
{ action = "ocr", label_key = "tools.ocr", glyph = "scan" },
|
||||
@@ -76,148 +96,185 @@ local ANNOTATE_TOOLS = {
|
||||
|
||||
local RECORD_TOOLS = {
|
||||
{ action = "record", label_key = "tools.record_gif", glyph = "gif" },
|
||||
{ action = "recordMp4", label_key = "tools.record_mp4", glyph = "movie" },
|
||||
{ action = "recordFullscreen", label_key = "tools.record_fullscreen_gif", glyph = "video" },
|
||||
{ action = "recordMp4", label_key = "tools.record_mp4", glyph = "video" },
|
||||
{ action = "recordFullscreen", label_key = "tools.record_fullscreen_gif", glyph = "gif" },
|
||||
{ action = "recordFullscreenMp4", label_key = "tools.record_fullscreen_mp4", glyph = "video" },
|
||||
}
|
||||
|
||||
-- For Legacy-mode layout
|
||||
local TOOLS_LEGACY = {
|
||||
{ id = "colorPicker", action = "colorPicker", label_key = "tools.colorpicker", glyph = "palette" },
|
||||
{ id = "palette", action = "palette", label_key = "tools.palette", glyph = "color-swatch" },
|
||||
{ id = "ocr", action = "ocr", label_key = "tools.ocr", glyph = "scan" },
|
||||
{ id = "qr", action = "qr", label_key = "tools.qr", glyph = "qrcode" },
|
||||
{ id = "annotate", action = "view_annotate", label_key = "tools.annotate", glyph = "pencil" },
|
||||
{ id = "record", action = "view_record", label_key = "tools.record", glyph = "video" },
|
||||
{ id = "measure", action = "measure", label_key = "tools.measure", glyph = "ruler" },
|
||||
{ id = "lens", action = "lens", label_key = "tools.lens", glyph = "search" },
|
||||
}
|
||||
|
||||
-- ── Keyboard Navigation State & Helpers ────────────────────────────────────
|
||||
|
||||
local function getActiveItems()
|
||||
local mode = getMode()
|
||||
if mode == "compact" or mode == "full" then
|
||||
local list = {}
|
||||
for _, t in ipairs(TOOLS) do table.insert(list, { type = "tool", action = t.action }) end
|
||||
for _, t in ipairs(ANNOTATE_TOOLS) do table.insert(list, { type = "tool", action = t.action }) end
|
||||
for _, t in ipairs(RECORD_TOOLS) do table.insert(list, { type = "tool", action = t.action }) end
|
||||
return list
|
||||
else
|
||||
if activeView == "annotate" then
|
||||
local list = { { type = "back" } }
|
||||
for _, t in ipairs(ANNOTATE_TOOLS) do table.insert(list, { type = "tool", action = t.action }) end
|
||||
table.insert(list, { type = "preview_screenshot" })
|
||||
return list
|
||||
elseif activeView == "record" then
|
||||
local list = { { type = "back" } }
|
||||
for _, t in ipairs(RECORD_TOOLS) do table.insert(list, { type = "tool", action = t.action }) end
|
||||
table.insert(list, { type = "sysAudio" })
|
||||
table.insert(list, { type = "micAudio" })
|
||||
if recording then table.insert(list, { type = "stopBtn" }) end
|
||||
table.insert(list, { type = "preview_recording" })
|
||||
return list
|
||||
else
|
||||
local list = {}
|
||||
for _, t in ipairs(TOOLS_LEGACY) do table.insert(list, { type = "legacy_tile", item = t }) end
|
||||
return list
|
||||
end
|
||||
end
|
||||
end
|
||||
|
||||
local function updateFocusedTool()
|
||||
local items = getActiveItems()
|
||||
if #items == 0 or focusedIndex == 0 or focusedIndex == nil then
|
||||
focusedTool = nil
|
||||
return
|
||||
end
|
||||
if focusedIndex > #items then focusedIndex = #items end
|
||||
if focusedIndex < 1 then focusedIndex = 1 end
|
||||
local cur = items[focusedIndex]
|
||||
if cur then
|
||||
if cur.type == "tool" then focusedTool = cur.action
|
||||
elseif cur.type == "legacy_tile" then focusedTool = cur.item.id
|
||||
else focusedTool = cur.type end
|
||||
else
|
||||
focusedTool = nil
|
||||
end
|
||||
end
|
||||
|
||||
-- Preview handlers for record and annotate subpanels.
|
||||
local function openScreenshotPreview()
|
||||
refreshPreview()
|
||||
local targetPath = lastCapturePath or (noctalia.fileExists and noctalia.fileExists(ANNOTATE_THUMB) and ANNOTATE_THUMB or nil)
|
||||
if not targetPath or targetPath == "" or (noctalia.fileExists and not noctalia.fileExists(targetPath)) then
|
||||
noctalia.notifyError("No screenshot preview available yet. Take a capture first!")
|
||||
return
|
||||
end
|
||||
if noctalia.commandExists("satty") then noctalia.runAsync("satty --filename " .. shellQuote(targetPath))
|
||||
elseif noctalia.commandExists("swappy") then noctalia.runAsync("swappy -f " .. shellQuote(targetPath))
|
||||
elseif noctalia.commandExists("gimp") then noctalia.runAsync("gimp " .. shellQuote(targetPath))
|
||||
else noctalia.notifyError(tr("messages.missing_dep", { dep = "satty (or swappy/gimp)" })) end
|
||||
end
|
||||
|
||||
local function openRecordingPreview()
|
||||
refreshPreview()
|
||||
local targetPath = lastRecordPath
|
||||
if not targetPath or targetPath == "" or (noctalia.fileExists and not noctalia.fileExists(targetPath)) then
|
||||
noctalia.notifyError("No recording preview available yet. Make a recording first!")
|
||||
return
|
||||
end
|
||||
if noctalia.commandExists("mpv") then noctalia.runAsync("mpv --no-config --title='Recording Preview' " .. shellQuote(targetPath))
|
||||
else noctalia.notifyError(tr("messages.missing_dep", { dep = "mpv" })) end
|
||||
end
|
||||
|
||||
local function headerActions(includeClose)
|
||||
local actions = {}
|
||||
if recording then
|
||||
table.insert(actions, ui.button({
|
||||
key = "header-stop-btn", glyph = "circle", variant = "destructive", controlSize = "sm", tooltip = tr("panel.stop"),
|
||||
onClick = function() hoveredStop = false; send("recordStop") end,
|
||||
}))
|
||||
end
|
||||
if includeClose then
|
||||
table.insert(actions, ui.button({
|
||||
key = "header-close-btn", glyph = "close", onClick = function() panel.close() end,
|
||||
}))
|
||||
end
|
||||
return ui.row({ gap = 4 }, actions)
|
||||
end
|
||||
|
||||
-- ── Compact mode ───────────────────────────────────────────────────────────
|
||||
|
||||
local function compactHeader()
|
||||
local actions = {
|
||||
ui.column({
|
||||
key = "close-button",
|
||||
width = 24,
|
||||
height = 24,
|
||||
radius = 9,
|
||||
fill = hoveredClose and "primary/0.12" or nil,
|
||||
border = hoveredClose and "primary" or "outline",
|
||||
borderWidth = 1,
|
||||
align = "center",
|
||||
justify = "center",
|
||||
onClick = function() panel.close() end,
|
||||
onHover = function(state)
|
||||
hoveredClose = state == "true"
|
||||
render()
|
||||
end,
|
||||
}, {
|
||||
ui.glyph({ name = "close", size = 14, color = hoveredClose and "on_surface" or "on_surface_variant" }),
|
||||
}),
|
||||
}
|
||||
if recording then
|
||||
table.insert(actions, 1, ui.column({
|
||||
key = "stop-button",
|
||||
width = 24,
|
||||
height = 24,
|
||||
radius = 9,
|
||||
fill = "error",
|
||||
border = hoveredStop and "on_surface" or nil,
|
||||
borderWidth = hoveredStop and 2 or 0,
|
||||
align = "center",
|
||||
justify = "center",
|
||||
tooltip = tr("panel.stop"),
|
||||
onClick = function() send("recordStop") end,
|
||||
onHover = function(state)
|
||||
hoveredStop = state == "true"
|
||||
render()
|
||||
end,
|
||||
}, {
|
||||
ui.glyph({ name = "square", size = 12, color = "on_surface" }),
|
||||
}))
|
||||
end
|
||||
return ui.row({ align = "center", gap = 6 }, {
|
||||
ui.glyph({ name = "crosshair", size = 16, color = "primary" }),
|
||||
ui.label({ text = tr("panel.title"), flexGrow = 1, fontSize = 16, fontWeight = "bold", color = "on_surface" }),
|
||||
ui.row({ gap = 4 }, actions),
|
||||
headerActions(true),
|
||||
})
|
||||
end
|
||||
|
||||
local function setHoveredTool(action)
|
||||
hoveredTool = action
|
||||
if action then
|
||||
for idx, item in ipairs(getActiveItems()) do
|
||||
local id = (item.type == "tool") and item.action or ((item.type == "legacy_tile") and item.item.id or item.type)
|
||||
if id == action then focusedIndex = idx; break end
|
||||
end
|
||||
else
|
||||
focusedIndex = 0
|
||||
end
|
||||
updateFocusedTool()
|
||||
end
|
||||
|
||||
local function compactTile(t)
|
||||
local color = hoveredTool == t.action and "primary" or "on_surface"
|
||||
local isFocused = (hoveredTool == t.action) or (focusedTool == t.action)
|
||||
local color = isFocused and "primary" or "on_surface"
|
||||
return ui.column({
|
||||
key = "tile-" .. t.action,
|
||||
flexGrow = 1,
|
||||
gap = 2,
|
||||
align = "center",
|
||||
key = "tile-" .. t.action, flexGrow = 1, gap = 2, align = "center", paddingV = 4, radius = 8,
|
||||
fill = isFocused and "primary/0.15" or "surface_variant", border = isFocused and "primary" or "surface_variant", borderWidth = isFocused and 1 or 0,
|
||||
onClick = function() runTool(t.action) end,
|
||||
onHover = function(state) setHoveredTool((state == "true") and t.action or nil); render() end,
|
||||
}, {
|
||||
ui.column({
|
||||
gap = 2,
|
||||
align = "center",
|
||||
onClick = function() runTool(t.action) end,
|
||||
onHover = function(state)
|
||||
hoveredTool = (state == "true") and t.action or nil
|
||||
render()
|
||||
end,
|
||||
}, {
|
||||
ui.column({ width = 30, height = 30, radius = 9, fill = "on_primary", border = color == "primary" and "primary" or "on_primary", borderWidth = 1, align = "center", justify = "center" }, {
|
||||
ui.glyph({ name = t.glyph, size = 16, color = color }),
|
||||
}),
|
||||
ui.label({ text = tr(t.label_key), maxWidth = 100, maxLines = 1, textAlign = "center", fontSize = 11, color = color }),
|
||||
ui.column({ width = 30, height = 30, radius = 9, fill = isFocused and "primary/0.2" or "on_primary", border = isFocused and "primary" or "on_primary", borderWidth = 1, align = "center", justify = "center" }, {
|
||||
ui.glyph({ name = t.glyph, size = 16, color = color }),
|
||||
}),
|
||||
ui.label({ text = tr(t.label_key), maxWidth = 100, maxLines = 1, textAlign = "center", fontSize = 11, color = color }),
|
||||
})
|
||||
end
|
||||
|
||||
local function compactToolsRow(tools)
|
||||
local row = {}
|
||||
for _, t in ipairs(tools) do
|
||||
row[#row + 1] = compactTile(t)
|
||||
end
|
||||
for _, t in ipairs(tools) do row[#row + 1] = compactTile(t) end
|
||||
return ui.row({ flexGrow = 1, gap = 2 }, row)
|
||||
end
|
||||
|
||||
local function compactSection(tools)
|
||||
return ui.column({ gap = 4, paddingV = 8, paddingH = 6, radius = 12, fill = "surface_variant" }, {
|
||||
compactToolsRow(tools),
|
||||
})
|
||||
return ui.column({ gap = 4, paddingV = 8, paddingH = 6, radius = 12, fill = "surface_variant" }, { compactToolsRow(tools) })
|
||||
end
|
||||
|
||||
local function compactGrid()
|
||||
return ui.column({ gap = 6 }, {
|
||||
compactSection(TOOLS),
|
||||
compactSection(ANNOTATE_TOOLS),
|
||||
compactSection(RECORD_TOOLS),
|
||||
})
|
||||
return ui.column({ gap = 6 }, { compactSection(TOOLS), compactSection(ANNOTATE_TOOLS), compactSection(RECORD_TOOLS) })
|
||||
end
|
||||
|
||||
-- ── Full mode ──────────────────────────────────────────────────────────────
|
||||
|
||||
local function fullHeader()
|
||||
local actions = {
|
||||
ui.button({ glyph = "close", onClick = function() panel.close() end }),
|
||||
}
|
||||
if recording then
|
||||
table.insert(actions, 1, ui.button({
|
||||
glyph = "square",
|
||||
variant = "destructive",
|
||||
controlSize = "sm",
|
||||
tooltip = tr("panel.stop"),
|
||||
onClick = function() send("recordStop") end,
|
||||
}))
|
||||
end
|
||||
return ui.row({ align = "center", gap = 10 }, {
|
||||
ui.glyph({ name = "crosshair", size = 24, color = "primary" }),
|
||||
ui.label({ text = tr("panel.title"), flexGrow = 1, fontSize = 22, fontWeight = "bold", color = "on_surface" }),
|
||||
ui.row({ gap = 4 }, actions),
|
||||
headerActions(true),
|
||||
})
|
||||
end
|
||||
|
||||
local function fullTile(t)
|
||||
local color = hoveredTool == t.action and "primary" or "on_surface"
|
||||
local isFocused = (hoveredTool == t.action) or (focusedTool == t.action)
|
||||
local color = isFocused and "primary" or "on_surface"
|
||||
return ui.column({
|
||||
key = "tile-" .. t.action,
|
||||
flexGrow = 1,
|
||||
gap = 6,
|
||||
align = "center",
|
||||
paddingV = 6,
|
||||
radius = 12,
|
||||
fill = "surface_variant",
|
||||
borderWidth = 1,
|
||||
border = color == "primary" and "primary" or "outline",
|
||||
key = "tile-" .. t.action, flexGrow = 1, gap = 6, align = "center", paddingV = 6, radius = 12,
|
||||
fill = "surface_variant", borderWidth = 1, border = color == "primary" and "primary" or "outline",
|
||||
onClick = function() runTool(t.action) end,
|
||||
onHover = function(state)
|
||||
hoveredTool = (state == "true") and t.action or nil
|
||||
render()
|
||||
end,
|
||||
onHover = function(state) setHoveredTool((state == "true") and t.action or nil); render() end,
|
||||
}, {
|
||||
ui.column({ width = 30, height = 30, radius = 9, fill = "on_primary", border = color == "primary" and "primary" or "on_primary", borderWidth = 1, align = "center", justify = "center" }, {
|
||||
ui.glyph({ name = t.glyph, size = 16, color = color }),
|
||||
@@ -228,9 +285,7 @@ end
|
||||
|
||||
local function fullToolsRow(tools)
|
||||
local row = {}
|
||||
for _, t in ipairs(tools) do
|
||||
row[#row + 1] = fullTile(t)
|
||||
end
|
||||
for _, t in ipairs(tools) do row[#row + 1] = fullTile(t) end
|
||||
return ui.row({ flexGrow = 1, gap = 6 }, row)
|
||||
end
|
||||
|
||||
@@ -240,43 +295,261 @@ end
|
||||
|
||||
local function fullGrid()
|
||||
return ui.column({ flexGrow = 1, gap = 4, justify = "space_between" }, {
|
||||
sectionLabel(tr("panel.section_capture")),
|
||||
fullToolsRow(TOOLS),
|
||||
sectionLabel(tr("panel.section_annotate")),
|
||||
fullToolsRow(ANNOTATE_TOOLS),
|
||||
sectionLabel(tr("panel.section_record")),
|
||||
fullToolsRow(RECORD_TOOLS),
|
||||
sectionLabel(tr("panel.section_capture")), fullToolsRow(TOOLS),
|
||||
sectionLabel(tr("panel.section_annotate")), fullToolsRow(ANNOTATE_TOOLS),
|
||||
sectionLabel(tr("panel.section_record")), fullToolsRow(RECORD_TOOLS),
|
||||
})
|
||||
end
|
||||
|
||||
-- ── Legacy mode ────────────────────────────────────────────────────────────
|
||||
|
||||
local function legacyHeader()
|
||||
return ui.row({ align = "center", gap = 5 }, {
|
||||
ui.glyph({ name = "crosshair", size = 18, color = "primary" }),
|
||||
ui.label({ text = tr("panel.title"), flexGrow = 1, fontSize = 18, fontWeight = "bold", color = "on_surface" }),
|
||||
headerActions(false),
|
||||
})
|
||||
end
|
||||
|
||||
local function SubpanelHeader(title)
|
||||
local isBackFocused = hoveredBack or (focusedTool == "back")
|
||||
return ui.row({ align = "center", gap = 5 }, {
|
||||
ui.glyph({ name = "crosshair", size = 18, color = "primary" }),
|
||||
ui.label({ text = title, flexGrow = 1, fontSize = 18, fontWeight = "bold", color = "on_surface" }),
|
||||
ui.column({
|
||||
key = "back-button", height = 30, width = 30, paddingH = 0, radius = 9,
|
||||
fill = isBackFocused and "primary/0.12" or "surface", border = isBackFocused and "primary" or "surface", borderWidth = 1,
|
||||
align = "center", justify = "center",
|
||||
onClick = function() activeView = "main"; focusedIndex = 0; updateFocusedTool(); render() end,
|
||||
onHover = function(state) setHoveredTool((state == "true") and "back" or nil); render() end,
|
||||
}, {
|
||||
ui.row({ align = "center", justify = "center", gap = 4 }, {
|
||||
ui.glyph({ name = "chevron-left", size = 16, color = isBackFocused and "primary" or "on_surface" }),
|
||||
}),
|
||||
}),
|
||||
})
|
||||
end
|
||||
|
||||
local function legacyTile(t)
|
||||
local isFocused = (hoveredTool == t.id) or (focusedTool == t.id)
|
||||
local color = isFocused and "primary" or "on_surface"
|
||||
local onClick = function()
|
||||
if t.action == "view_annotate" then activeView = "annotate"; focusedIndex = 0; updateFocusedTool(); render()
|
||||
elseif t.action == "view_record" then activeView = "record"; focusedIndex = 0; updateFocusedTool(); render()
|
||||
else runTool(t.action) end
|
||||
end
|
||||
return ui.column({
|
||||
key = "tile-" .. t.id, flexGrow = 1, gap = 2, paddingV = 5, paddingH = 0, align = "center", justify = "center", onClick = onClick,
|
||||
onHover = function(state) setHoveredTool((state == "true") and t.id or nil); render() end,
|
||||
}, {
|
||||
ui.column({ width = 50, height = 50, radius = 15, fill = "on_primary", border = color == "primary" and "primary" or "outline", borderWidth = isFocused and 2 or 0, align = "center", justify = "center" }, {
|
||||
ui.glyph({ name = t.glyph, size = 25, color = color }),
|
||||
}),
|
||||
ui.label({ text = tr(t.label_key), maxWidth = 80, maxLines = 1, textAlign = "center", fontSize = 11, color = color }),
|
||||
})
|
||||
end
|
||||
|
||||
local function legacyGrid()
|
||||
local row1, row2 = {}, {}
|
||||
for i, t in ipairs(TOOLS_LEGACY) do table.insert(i <= 4 and row1 or row2, legacyTile(t)) end
|
||||
return ui.column({ gap = 10, paddingV = 15, paddingH = 20, radius = 18, fill = "surface_variant" }, {
|
||||
ui.row({ flexGrow = 1, gap = 0 }, row1), ui.row({ flexGrow = 1, gap = 0 }, row2),
|
||||
})
|
||||
end
|
||||
|
||||
-- Subpanels for legacy mode: annotate and record.
|
||||
|
||||
local function subpanelButton(t, paddingV)
|
||||
local isFocused = (hoveredTool == t.action) or (focusedTool == t.action)
|
||||
local color = isFocused and "primary" or "on_surface"
|
||||
return ui.column({
|
||||
key = "btn-" .. t.action, paddingV = paddingV, paddingH = 5, radius = 8,
|
||||
fill = isFocused and "primary/0.12" or "surface", border = isFocused and "primary" or "surface", borderWidth = 1,
|
||||
onClick = function() runTool(t.action) end,
|
||||
onHover = function(state) setHoveredTool((state == "true") and t.action or nil); render() end,
|
||||
}, {
|
||||
ui.row({ align = "center", gap = 6 }, {
|
||||
ui.glyph({ name = t.glyph, size = 15, color = color }),
|
||||
ui.label({ text = tr(t.label_key), fontSize = 12, fontWeight = "bold", color = color }),
|
||||
}),
|
||||
})
|
||||
end
|
||||
|
||||
local function MarkupSubpanel()
|
||||
refreshPreview()
|
||||
local leftButtons = {}
|
||||
for _, t in ipairs(ANNOTATE_TOOLS) do table.insert(leftButtons, subpanelButton(t, 6)) end
|
||||
local fileExists = noctalia.fileExists
|
||||
local hasCaptureFile = lastCapturePath and lastCapturePath ~= "" and (not fileExists or fileExists(lastCapturePath))
|
||||
local isPreviewFocused = (focusedTool == "preview_screenshot")
|
||||
local rightPreview = ui.column({
|
||||
width = 200, height = 150, align = "center", justify = "center", padding = hasCaptureFile and 4 or 8, radius = 10, fill = "surface",
|
||||
border = isPreviewFocused and "primary" or "outline", borderWidth = isPreviewFocused and 2 or 1, onClick = openScreenshotPreview,
|
||||
}, hasCaptureFile and {
|
||||
ui.image({ path = lastCapturePath, width = 200, height = 130, fit = "contain", radius = 6 }),
|
||||
ui.label({ text = "Click to open in Satty", fontSize = 10, fontWeight = "bold", color = "primary" }),
|
||||
} or {
|
||||
ui.glyph({ name = "pencil", size = 28, color = "on_surface_variant" }),
|
||||
ui.label({ text = "No screenshot yet", fontSize = 11, color = "on_surface_variant" }),
|
||||
})
|
||||
return ui.column({ flexGrow = 1, gap = 10 }, {
|
||||
SubpanelHeader("Markup"),
|
||||
ui.column({ gap = 10, paddingV = 15, paddingH = 20, radius = 18, fill = "surface_variant" }, {
|
||||
ui.row({ flexGrow = 1, gap = 10 }, { ui.column({ width = 100, gap = 6 }, leftButtons), rightPreview }),
|
||||
}),
|
||||
})
|
||||
end
|
||||
|
||||
local function RecordSubpanel()
|
||||
refreshPreview()
|
||||
local leftButtons = {}
|
||||
for _, t in ipairs(RECORD_TOOLS) do table.insert(leftButtons, subpanelButton(t, 4)) end
|
||||
local stopFocused = hoveredStop or (focusedTool == "stopBtn")
|
||||
local stopBtn = ui.column({
|
||||
key = "btn-stop-record", width = 28, height = 28, radius = 6, fill = "error", border = stopFocused and "primary" or "error", borderWidth = stopFocused and 2 or 1, align = "center", justify = "center",
|
||||
onClick = function() send("recordStop") end,
|
||||
onHover = function(state) setHoveredTool((state == "true") and "stopBtn" or nil); render() end,
|
||||
}, { ui.glyph({ name = "circle", size = 16, color = "on_primary", align = "center", justify = "center" }) })
|
||||
|
||||
local sysAudioFocused = hoveredAudioOut or (focusedTool == "sysAudio")
|
||||
local sysAudioBtn = ui.column({
|
||||
key = "toggle-sys-audio", width = 28, height = 28, radius = 6,
|
||||
fill = recordAudioOut and (sysAudioFocused and "primary/0.25" or "primary/0.15") or (sysAudioFocused and "surface_variant" or "surface_variant/0.5"),
|
||||
border = (recordAudioOut or sysAudioFocused) and "primary" or "outline", borderWidth = 1, align = "center", justify = "center",
|
||||
onClick = function() recordAudioOut = not recordAudioOut; send("setAudioOut", recordAudioOut); render() end,
|
||||
onHover = function(state) setHoveredTool((state == "true") and "sysAudio" or nil); render() end,
|
||||
}, { ui.glyph({ name = recordAudioOut and "volume-2" or "volume-x", size = 16, color = (recordAudioOut or sysAudioFocused) and "primary" or "on_surface_variant" }) })
|
||||
|
||||
local micAudioFocused = hoveredAudioIn or (focusedTool == "micAudio")
|
||||
local micAudioBtn = ui.column({
|
||||
key = "toggle-mic-audio", width = 28, height = 28, radius = 6,
|
||||
fill = recordAudioIn and (micAudioFocused and "primary/0.25" or "primary/0.15") or (micAudioFocused and "surface_variant" or "surface_variant/0.5"),
|
||||
border = (recordAudioIn or micAudioFocused) and "primary" or "outline", borderWidth = 1, align = "center", justify = "center",
|
||||
onClick = function() recordAudioIn = not recordAudioIn; send("setAudioIn", recordAudioIn); render() end,
|
||||
onHover = function(state) setHoveredTool((state == "true") and "micAudio" or nil); render() end,
|
||||
}, { ui.glyph({ name = recordAudioIn and "microphone" or "microphone-off", size = 16, color = (recordAudioIn or micAudioFocused) and "primary" or "on_surface_variant" }) })
|
||||
|
||||
local controlsList = { sysAudioBtn, micAudioBtn }
|
||||
if recording then table.insert(controlsList, 1, stopBtn) end
|
||||
local controlRow = ui.row({ gap = 6, align = "center", justify = "center" }, controlsList)
|
||||
local fileExists = noctalia.fileExists
|
||||
local hasRecordFile = lastRecordPath and lastRecordPath ~= "" and (not fileExists or fileExists(lastRecordPath))
|
||||
local hasRecordThumb = hasRecordFile and fileExists and fileExists(RECORD_THUMB)
|
||||
local isPreviewFocused = (focusedTool == "preview_recording")
|
||||
local rightPreview
|
||||
if hasRecordFile or hasRecordThumb then
|
||||
local thumbElement = hasRecordThumb and ui.image({ path = RECORD_THUMB, width = 240, height = 115, fit = "contain", radius = 6 }) or ui.glyph({ name = "movie", size = 28, color = "primary" })
|
||||
local filename = lastRecordPath and (lastRecordPath:match("([^/]+)$") or lastRecordPath) or "Saved Recording"
|
||||
rightPreview = ui.column({
|
||||
width = 200, height = 150, align = "center", justify = "center", padding = hasRecordFile and 4 or 8, radius = 10, fill = "surface",
|
||||
border = isPreviewFocused and "primary" or "outline", borderWidth = isPreviewFocused and 2 or 1, onClick = openRecordingPreview,
|
||||
}, { thumbElement, ui.label({ text = filename, maxWidth = 160, maxLines = 1, fontSize = 9, color = "on_surface_variant" }), ui.label({ text = "Click to play in MPV", fontSize = 10, fontWeight = "bold", color = "primary" }) })
|
||||
else
|
||||
rightPreview = ui.column({
|
||||
width = 200, height = 130, align = "center", justify = "center", padding = 8, radius = 10, fill = "surface",
|
||||
border = isPreviewFocused and "primary" or "outline", borderWidth = isPreviewFocused and 2 or 1, onClick = openRecordingPreview,
|
||||
}, { ui.glyph({ name = "video", size = 28, color = "on_surface_variant" }), ui.label({ text = "No recording yet", fontSize = 11, color = "on_surface_variant" }) })
|
||||
end
|
||||
local leftColumn = ui.column({ width = 100, gap = 6, align = "center" }, {
|
||||
ui.column({ width = 100, gap = 6 }, leftButtons),
|
||||
controlRow,
|
||||
})
|
||||
return ui.column({ flexGrow = 1, gap = 10 }, {
|
||||
SubpanelHeader("Record"),
|
||||
ui.column({ gap = 10, paddingV = 15, paddingH = 20, radius = 18, fill = "surface_variant" }, {
|
||||
ui.row({ flexGrow = 1, gap = 10 }, { leftColumn, rightPreview }),
|
||||
}),
|
||||
})
|
||||
end
|
||||
|
||||
-- ── Keyboard Handler ───────────────────────────────────────────────────────
|
||||
|
||||
function onKey(chord, pressed)
|
||||
if not pressed then return end
|
||||
local key = tostring(chord):lower()
|
||||
local items = getActiveItems()
|
||||
if #items == 0 then return end
|
||||
local mode = getMode()
|
||||
if chord == "Escape" then panel.close() return end
|
||||
|
||||
-- If nothing is focused yet (focusedIndex == 0), pressing arrow keys/tab takes focus directly to 1st square
|
||||
if focusedIndex == 0 or focusedIndex == nil then
|
||||
if key == "tab" or key == "right" or key == "left" or key == "backtab" or key == "shift+tab" or key == "down" or key == "up" then
|
||||
focusedIndex = 1
|
||||
updateFocusedTool()
|
||||
render()
|
||||
return
|
||||
end
|
||||
end
|
||||
|
||||
if key == "tab" or key == "right" then
|
||||
focusedIndex = (focusedIndex % #items) + 1
|
||||
elseif key == "backtab" or key == "left" then
|
||||
focusedIndex = (focusedIndex - 2) % #items + 1
|
||||
elseif key == "down" then
|
||||
if mode == "legacy" and activeView == "main" then
|
||||
focusedIndex = focusedIndex <= 4 and (focusedIndex + 4) or (focusedIndex - 4)
|
||||
elseif mode == "compact" or mode == "full" then
|
||||
focusedIndex = (focusedIndex <= 6 and math.min(7 + math.floor((focusedIndex - 1) / 2), 9)) or (focusedIndex <= 9 and (10 + (focusedIndex - 7)) or ((focusedIndex - 10) + 1))
|
||||
else
|
||||
focusedIndex = (focusedIndex % #items) + 1
|
||||
end
|
||||
elseif key == "up" then
|
||||
if mode == "legacy" and activeView == "main" then
|
||||
focusedIndex = focusedIndex > 4 and (focusedIndex - 4) or (focusedIndex + 4)
|
||||
elseif mode == "compact" or mode == "full" then
|
||||
focusedIndex = (focusedIndex >= 10 and math.min(7 + (focusedIndex - 10), 9)) or (focusedIndex >= 7 and ((focusedIndex - 7) * 2 + 1) or math.min(10 + math.floor((focusedIndex - 1) / 2), 13))
|
||||
else
|
||||
focusedIndex = (focusedIndex - 2) % #items + 1
|
||||
end
|
||||
elseif key == "return" or key == "enter" or key == "space" then
|
||||
local current = items[focusedIndex]
|
||||
if current then
|
||||
if current.type == "tool" then runTool(current.action)
|
||||
elseif current.type == "legacy_tile" then
|
||||
if current.item.action == "view_annotate" then activeView = "annotate"; focusedIndex = 0
|
||||
elseif current.item.action == "view_record" then activeView = "record"; focusedIndex = 0
|
||||
else runTool(current.item.action) end
|
||||
elseif current.type == "back" then activeView = "main"; focusedIndex = 0
|
||||
elseif current.type == "sysAudio" then recordAudioOut = not recordAudioOut; send("setAudioOut", recordAudioOut)
|
||||
elseif current.type == "micAudio" then recordAudioIn = not recordAudioIn; send("setAudioIn", recordAudioIn)
|
||||
elseif current.type == "stopBtn" then send("recordStop")
|
||||
elseif current.type == "preview_screenshot" then openScreenshotPreview()
|
||||
elseif current.type == "preview_recording" then openRecordingPreview() end
|
||||
end
|
||||
end
|
||||
updateFocusedTool()
|
||||
render()
|
||||
end
|
||||
|
||||
-- ── Main render ────────────────────────────────────────────────────────────
|
||||
|
||||
render = function()
|
||||
local body
|
||||
if getMode() == "full" then
|
||||
body = ui.column({ flexGrow = 1, gap = 10 }, {
|
||||
fullHeader(),
|
||||
fullGrid(),
|
||||
})
|
||||
else
|
||||
body = ui.column({ flexGrow = 1, gap = 6 }, {
|
||||
compactHeader(),
|
||||
compactGrid(),
|
||||
})
|
||||
end
|
||||
updateFocusedTool()
|
||||
local mode = getMode()
|
||||
local body = (mode == "full" and ui.column({ flexGrow = 1, gap = 10 }, { fullHeader(), fullGrid() }))
|
||||
or (mode == "compact" and ui.column({ flexGrow = 1, gap = 6 }, { compactHeader(), compactGrid() }))
|
||||
or (activeView == "annotate" and MarkupSubpanel())
|
||||
or (activeView == "record" and RecordSubpanel())
|
||||
or ui.column({ flexGrow = 1, gap = 6 }, { legacyHeader(), legacyGrid() })
|
||||
panel.render(body)
|
||||
end
|
||||
|
||||
-- ── Lifecycle ──────────────────────────────────────────────────────────────
|
||||
|
||||
function onOpen(_context)
|
||||
panelOpen = true
|
||||
hoveredTool = nil
|
||||
panelOpen, hoveredTool, focusedIndex, activeView = true, false, 0, "main"
|
||||
recordAudioOut = (noctalia.getConfig("record-audio-out") == true)
|
||||
recordAudioIn = false
|
||||
send("setAudioOut", recordAudioOut)
|
||||
send("setAudioIn", false)
|
||||
refreshPreview()
|
||||
updateFocusedTool()
|
||||
render()
|
||||
end
|
||||
|
||||
function onClose()
|
||||
panelOpen = false
|
||||
panelOpen, hoveredBack = false, false
|
||||
end
|
||||
|
||||
noctalia.state.watch("recording", function(v)
|
||||
|
||||
Reference in New Issue
Block a user