feat: remaining chapter time in topbar

closes #839

src/uosc/elements/TopBar.lua

@@ -203,6 +203,7 @@ function TopBar:render()
 	if state.title or state.has_playlist then
 		local bg_margin = math.floor((self.size - self.font_size) / 4)
 		local padding = self.font_size / 2
+		local spacing = 1
 		local title_ax = self.ax + bg_margin
 		local title_ay = self.ay + bg_margin
 		local max_bx = self.title_bx - self.spacing
@@ -259,7 +260,7 @@ function TopBar:render()
 					color = bg, opacity = visibility * config.opacity.title, radius = state.radius,
 				})
 				ass:txt(title_ax + padding, self.ay + (self.size / 2), 4, main_title, opts)
-				title_ay = by + 1
+				title_ay = by + spacing
 			end
 
 			-- Alt title
@@ -281,14 +282,19 @@ function TopBar:render()
 					color = bg, opacity = visibility * config.opacity.title, radius = state.radius,
 				})
 				ass:txt(title_ax + padding, title_ay + height / 2, 4, self.alt_title, opts)
-				title_ay = by + 1
+				title_ay = by + spacing
 			end
 
-			-- Subtitle: current chapter
+			-- Current chapter
 			if state.current_chapter then
+				local padding_half = round(padding / 2)
 				local font_size = self.font_size * 0.8
 				local height = font_size * 1.3
 				local text = '└ ' .. state.current_chapter.index .. ': ' .. state.current_chapter.title
+				local next_chapter = state.chapters[state.current_chapter.index + 1]
+				local chapter_end = next_chapter and next_chapter.time or state.duration or 0
+				local remaining_time = (state.time and state.time or 0) - chapter_end
+				local remaining_human = format_time(remaining_time, math.abs(remaining_time))
 				local opts = {
 					size = font_size,
 					italic = true,
@@ -298,21 +304,38 @@ function TopBar:render()
 					border_color = bg,
 					opacity = visibility * 0.8,
 				}
+				local remaining_width = timestamp_width(remaining_human, opts)
+				local remaining_box_width = remaining_width + padding_half * 2
+
+				-- Title
 				local rect = {
 					ax = title_ax,
 					ay = title_ay,
-					bx = round(math.min(max_bx, title_ax + text_width(text, opts) + padding * 2)),
+					bx = round(math.min(
+						max_bx - remaining_box_width - spacing,
+						title_ax + text_width(text, opts) + padding * 2
+					)),
 					by = title_ay + height,
 				}
 				opts.clip = string.format('\\clip(%d, %d, %d, %d)', title_ax, title_ay, rect.bx, rect.by)
 				ass:rect(rect.ax, rect.ay, rect.bx, rect.by, {
 					color = bg, opacity = visibility * config.opacity.title, radius = state.radius,
 				})
 				ass:txt(rect.ax + padding, rect.ay + height / 2, 4, text, opts)
-				title_ay = rect.by + 1
 
 				-- Click action
 				cursor:zone('primary_down', rect, function() mp.command('script-binding uosc/chapters') end)
+
+				-- Time
+				rect.ax = rect.bx + spacing
+				rect.bx = rect.ax + remaining_box_width
+				opts.clip = nil
+				ass:rect(rect.ax, rect.ay, rect.bx, rect.by, {
+					color = bg, opacity = visibility * config.opacity.title, radius = state.radius,
+				})
+				ass:txt(rect.ax + padding_half, rect.ay + height / 2, 4, remaining_human, opts)
+
+				title_ay = rect.by + spacing
 			end
 		end
 		self.title_by = title_ay - 1