Add playlist visual indicators and split panel layout
All checks were successful
Build and Release / build-and-release (push) Successful in 52s
All checks were successful
Build and Release / build-and-release (push) Successful in 52s
- Highlight files/folders in playlist with bold white text in file tree - Show folders as in-playlist when they contain playlist items - Split UI into files (70%) and playlist (30%) panels - Make selection bar bold when over playlist items - Fix search to keep selection on found item after pressing Enter
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
[package]
|
||||
name = "cm-player"
|
||||
version = "0.1.37"
|
||||
version = "0.1.38"
|
||||
edition = "2021"
|
||||
|
||||
[dependencies]
|
||||
|
||||
@@ -813,7 +813,12 @@ impl AppState {
|
||||
}
|
||||
|
||||
pub fn execute_search(&mut self) {
|
||||
self.exit_search_mode();
|
||||
// Keep the current selection and expanded state (don't restore saved_expanded_dirs)
|
||||
self.search_mode = false;
|
||||
self.search_query.clear();
|
||||
self.search_results.clear();
|
||||
self.search_result_index = 0;
|
||||
// Don't restore expanded_dirs - keep current state so selection stays visible
|
||||
}
|
||||
|
||||
pub fn append_playlist_search_char(&mut self, c: char) {
|
||||
|
||||
@@ -28,52 +28,47 @@ pub fn render(frame: &mut Frame, state: &mut AppState, player: &mut Player) -> (
|
||||
])
|
||||
.split(frame.area());
|
||||
|
||||
// Always use tab mode - show only the focused panel
|
||||
let tab_mode = true;
|
||||
// Split main content into files (70%) and playlist (30%)
|
||||
let content_chunks = Layout::default()
|
||||
.direction(Direction::Vertical)
|
||||
.constraints([
|
||||
Constraint::Percentage(70), // Files panel
|
||||
Constraint::Percentage(30), // Playlist panel
|
||||
])
|
||||
.split(main_chunks[1]);
|
||||
|
||||
// Build the title with focused panel in bold
|
||||
let file_style = if !state.focus_playlist {
|
||||
Style::default().fg(Theme::bright_foreground()).add_modifier(Modifier::BOLD)
|
||||
} else {
|
||||
Style::default().fg(Theme::bright_foreground())
|
||||
};
|
||||
// Build the files panel title
|
||||
let file_style = Style::default().fg(Theme::bright_foreground());
|
||||
|
||||
let playlist_style = if state.focus_playlist {
|
||||
Style::default().fg(Theme::bright_foreground()).add_modifier(Modifier::BOLD)
|
||||
} else {
|
||||
Style::default().fg(Theme::bright_foreground())
|
||||
};
|
||||
let files_block = Block::default()
|
||||
.borders(Borders::ALL)
|
||||
.title(Span::styled("files", file_style))
|
||||
.style(Theme::widget_border_style());
|
||||
|
||||
// Build the playlist panel title
|
||||
let playlist_style = Style::default().fg(Theme::bright_foreground());
|
||||
|
||||
// Add playlist counter
|
||||
let playlist_text = if !state.playlist.is_empty() {
|
||||
format!("playlist [{}/{}]", state.playlist_index + 1, state.playlist.len())
|
||||
} else {
|
||||
"playlist (empty)".to_string()
|
||||
"playlist".to_string()
|
||||
};
|
||||
|
||||
let title = Line::from(vec![
|
||||
Span::styled("files", file_style),
|
||||
Span::raw(" | "),
|
||||
Span::styled(playlist_text, playlist_style),
|
||||
]);
|
||||
|
||||
// Create one border around the entire content area with fixed gray border
|
||||
let main_block = Block::default()
|
||||
let playlist_block = Block::default()
|
||||
.borders(Borders::ALL)
|
||||
.title(title)
|
||||
.title(Span::styled(playlist_text, playlist_style))
|
||||
.style(Theme::widget_border_style());
|
||||
|
||||
let inner_area = main_block.inner(main_chunks[1]);
|
||||
let files_inner = files_block.inner(content_chunks[0]);
|
||||
let playlist_inner = playlist_block.inner(content_chunks[1]);
|
||||
|
||||
render_title_bar(frame, state, player, main_chunks[0]);
|
||||
frame.render_widget(main_block, main_chunks[1]);
|
||||
|
||||
// Tab mode - show only focused panel
|
||||
if state.focus_playlist {
|
||||
render_right_panel(frame, state, inner_area, tab_mode);
|
||||
} else {
|
||||
render_file_panel(frame, state, inner_area, tab_mode);
|
||||
}
|
||||
frame.render_widget(files_block, content_chunks[0]);
|
||||
frame.render_widget(playlist_block, content_chunks[1]);
|
||||
|
||||
render_file_panel(frame, state, files_inner, false);
|
||||
render_right_panel(frame, state, playlist_inner, false);
|
||||
|
||||
render_status_bar(frame, state, player, main_chunks[2]);
|
||||
|
||||
@@ -93,12 +88,7 @@ pub fn render(frame: &mut Frame, state: &mut AppState, player: &mut Player) -> (
|
||||
}
|
||||
|
||||
// Return title bar area, file panel area, and playlist area for mouse event handling
|
||||
// Use main_chunks[1] (full area) so mouse coordinates align properly
|
||||
if state.focus_playlist {
|
||||
(main_chunks[0], Rect::default(), main_chunks[1])
|
||||
} else {
|
||||
(main_chunks[0], main_chunks[1], Rect::default())
|
||||
}
|
||||
(main_chunks[0], content_chunks[0], content_chunks[1])
|
||||
}
|
||||
|
||||
fn highlight_search_matches<'a>(text: &str, query: &str, is_selected: bool) -> Vec<Span<'a>> {
|
||||
@@ -239,15 +229,30 @@ fn render_file_panel(frame: &mut Frame, state: &mut AppState, area: Rect, _tab_m
|
||||
|
||||
let suffix = if item.is_dir { "/" } else { "" };
|
||||
|
||||
// Check if item is in playlist (for files) or contains playlist items (for folders)
|
||||
let in_playlist = if item.is_dir {
|
||||
state.playlist.iter().any(|p| p.starts_with(&item.path))
|
||||
} else {
|
||||
state.playlist.contains(&item.path)
|
||||
};
|
||||
|
||||
let base_style = if is_selected {
|
||||
// Selection bar: yellow/orange when in search (typing or viewing results), blue otherwise
|
||||
if in_search {
|
||||
let style = if in_search {
|
||||
Theme::search_selected()
|
||||
} else {
|
||||
Theme::selected()
|
||||
};
|
||||
// Bold if item is in playlist
|
||||
if in_playlist {
|
||||
style.add_modifier(ratatui::style::Modifier::BOLD)
|
||||
} else {
|
||||
style
|
||||
}
|
||||
} else if state.marked_files.contains(&item.path) {
|
||||
Theme::marked()
|
||||
} else if in_playlist {
|
||||
Theme::in_playlist()
|
||||
} else {
|
||||
Theme::secondary()
|
||||
};
|
||||
|
||||
@@ -95,4 +95,11 @@ impl Theme {
|
||||
.fg(Self::background())
|
||||
.bg(Self::warning())
|
||||
}
|
||||
|
||||
pub fn in_playlist() -> Style {
|
||||
Style::default()
|
||||
.fg(Self::bright_foreground())
|
||||
.bg(Self::background())
|
||||
.add_modifier(ratatui::style::Modifier::BOLD)
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user