other: use vhs to automatically record demo gif (#2006)

This PR adds a vhs "tape" file to automatically do the demo gif
recording. The point of this is to make it more consistent/easy to do,
and this has the benefit of making a smaller gif file.

Cargo.toml

@@ -17,6 +17,7 @@ exclude = [
     ".idea/",
     ".vscode/",
     "assets/",
+    "demos/",
     "desktop/",
     "docs/",
     "flamegraphs/",

README.md

@@ -14,7 +14,7 @@
 </div>
 
 <div align="center">
-  <img src="assets/demo.gif" alt="Quick demo recording showing off bottom's searching, expanding, and process killing."/>
+  <img src="demos/demo.gif" alt="Quick demo recording showing off bottom's searching, expanding, and process killing."/>
   <p>
     <sub>
       Demo using the <a href="https://github.com/morhetz/gruvbox">Gruvbox</a> theme (<code>--theme gruvbox</code>), along with <a href="https://www.ibm.com/plex/">IBM Plex Mono</a> and <a href="https://sw.kovidgoyal.net/kitty/">Kitty</a>
@@ -68,7 +68,6 @@
 As (yet another) process/system visualization and management application, bottom supports the typical features:
 
 - Graphical visualization widgets for:
-
   - [CPU usage](https://bottom.pages.dev/nightly/usage/widgets/cpu/) over time, at an average and per-core level
   - [RAM and swap usage](https://bottom.pages.dev/nightly/usage/widgets/memory/) over time
   - [Network I/O usage](https://bottom.pages.dev/nightly/usage/widgets/network/) over time
@@ -76,27 +75,23 @@ As (yet another) process/system visualization and management application, bottom
   with support for zooming in/out the current time interval displayed.
 
 - Widgets for displaying info about:
-
   - [Disk capacity/usage](https://bottom.pages.dev/nightly/usage/widgets/disk/)
   - [Temperature sensors](https://bottom.pages.dev/nightly/usage/widgets/temperature/)
   - [Battery usage](https://bottom.pages.dev/nightly/usage/widgets/battery/)
 
 - [A process widget](https://bottom.pages.dev/nightly/usage/widgets/process/) for displaying, sorting, and searching info about processes, as well as support for:
-
   - [Kill signals](https://bottom.pages.dev/nightly/usage/widgets/process/#process-termination)
   - [Tree mode](https://bottom.pages.dev/nightly/usage/widgets/process/#tree-mode)
 
 - [Cross-platform support](https://github.com/ClementTsang/bottom#support) for Linux, macOS, and Windows, with more planned in the future.
 
 - [Customizable behaviour](https://bottom.pages.dev/nightly/configuration/command-line-options/) that can be controlled with command-line options or a config file, such as:
-
   - Custom and built-in colour themes
   - Customizing widget behaviour
   - Changing the layout of widgets
   - Filtering out entries in some widgets
 
 - And more:
-
   - [An htop-inspired basic mode](https://bottom.pages.dev/nightly/usage/basic-mode/)
   - [Expansion, which focuses on just one widget](https://bottom.pages.dev/nightly/usage/general-usage/#expansion)
 

demos/demo.tape

@@ -0,0 +1,225 @@
+# VHS for bottom.
+# To use:
+#   1. Install vhs, launch firefox and kitty. Install speedcrunch as that's our target application to kill.
+#   2. Compile using `cargo build --release`
+#   3. Run in the project directory `vhs demos/demo.tape`.
+#   4. Wait for it to finish, this will take a few minutes.
+#   5. Check the output gif in `demos/demo.gif`.
+#   6. Optimize the gif size. What seems to work is resize to 960x540, then optimize. Tools like Ezgif are great, and aim for 2-3 MB.
+
+# Output configuration
+Output demos/demo.gif
+
+# Terminal settings
+Set Shell bash
+Set FontSize 16
+Set Width 1280
+Set Height 720
+Set Padding 10
+Set Theme "Dracula"
+Set Framerate 30
+
+Hide
+Type "speedcrunch &"
+Enter
+Type "./target/release/btm -C sample_configs/demo_config.toml"
+Enter
+
+# Let it stabilize and show the initial view
+Sleep 120s
+Show
+
+# Start. Have a sleep so there's at least a few seconds of stability.
+Sleep 2s
+
+# Expand
+Type "e"
+Sleep 1s
+
+# Zoom out
+Type@100ms "----------"
+Sleep 1s
+
+# Zoom back in
+Type@100ms "++++++++++"
+Sleep 1s
+
+# Go to the CPU usage scroll
+Ctrl+Right
+Sleep 0.2s
+
+# Scroll down
+Down
+Sleep 0.2s
+Down
+Sleep 0.2s
+Down
+Sleep 0.2s
+Down
+Sleep 0.2s
+Down
+Sleep 0.2s
+Sleep 1s
+
+# Scroll back to average
+Up
+Sleep 0.2s
+Up
+Sleep 0.2s
+Up
+Sleep 0.2s
+Up
+Sleep 0.2s
+Sleep 1s
+
+# Undo expand
+Type "e"
+Sleep 1s
+
+# Now go to the memory widget
+Sleep 1s
+Ctrl+Left
+Sleep 0.2s
+Ctrl+Down
+Sleep 0.2s
+Sleep 0.5s
+
+# Scroll out a few times
+Type@100ms "---"
+Sleep 1s
+
+# Now go to the network widget
+Sleep 1s
+Ctrl+Down
+Sleep 0.2s
+Sleep 0.5s
+
+# Scroll in twice
+Type@50ms "++"
+Sleep 1s
+
+# Now go to the temperature widget and scroll around, then change sort
+Sleep 1.5s
+Ctrl+Up
+Sleep 0.2s
+Ctrl+Right
+Sleep 0.2s
+Sleep 1.1s
+Down
+Sleep 0.05s
+Down
+Sleep 0.05s
+Down
+Sleep 0.05s
+Down
+Sleep 0.05s
+Down
+Sleep 0.05s
+Down
+Sleep 0.05s
+Down
+Sleep 0.05s
+Down
+Sleep 0.05s
+Sleep 1s
+Type "gg"
+Sleep 1s
+Type "s"
+Sleep 1.5s
+Type "s"
+Sleep 1.5s
+Type "t"
+Sleep 1.5s
+Type "t"
+Sleep 1.5s
+
+# Go to disk and show off column sorting again
+Sleep 1s
+Ctrl+Down
+Sleep 1s
+Type "e"
+Sleep 1s
+Type "d"
+Sleep 1.5s
+Type "m"
+Sleep 1.5s
+Type "u"
+Sleep 1.5s
+Sleep 1s
+Type "e"
+Sleep 1s
+
+# Go to processes
+Sleep 1s
+Ctrl+Down
+Sleep 1s
+Type "e"
+Sleep 1s
+
+# Show off process sorting
+Type "p"
+Sleep 1s
+Type "p"
+Sleep 1.5s
+Type "c"
+Sleep 1.5s
+Type "P"
+Sleep 2s
+Type "P"
+
+# Show off tree mode
+Sleep 1s
+Type "t"
+Sleep 3s
+Type "-"
+Sleep 0.5s
+Down
+Type "-"
+Sleep 0.5s
+Type "-"
+Sleep 0.5s
+Up
+Type "-"
+Sleep 1s
+Type "t"
+
+# Show off search
+Sleep 1s
+Type "/"
+Type@100ms "firefox OR kitty"
+Sleep 2s
+Ctrl+u
+Sleep 1s
+Alt+w
+Sleep 0.5s
+Type @250ms"pid=37 OR cpu>1"
+Sleep 2s
+Ctrl+u
+Sleep 0.2s
+Alt+w
+Sleep 0.2s
+Alt+r
+Type@100ms "kworker/1[1-3]"
+Sleep 2s
+Ctrl+u
+
+# Show off process killing
+Sleep 1s
+Type@100ms "speedcrunch"
+Sleep 1s
+Ctrl+Up
+Delete
+Sleep 1s
+Enter
+Escape
+Sleep 0.5s
+Escape
+Sleep 0.5s
+Type "/"
+Sleep 0.5s
+Ctrl+u
+Sleep 0.5s
+Escape
+
+# Done
+Sleep 3s

sample_configs/demo_config.toml

@@ -10,7 +10,7 @@ current_usage = false
 group_processes = false
 case_sensitive = false
 whole_word = false
-regex = true
+regex = false
 default_widget_type = "cpu"
 default_widget_count = 1
 

src/canvas/widgets/cpu_graph.rs

@@ -241,7 +241,7 @@ impl Painter {
                 loc: draw_loc,
                 force_redraw: app_state.is_force_redraw,
                 recalculate_column_widths,
-                selection_state: SelectionState::new(app_state.is_expanded, is_on_widget),
+                selection_state: SelectionState::new(app_state.is_expanded, is_on_widget), // TODO: Bug with this, shouldn't be selected on expand!
             };
 
             cpu_widget_state.table.draw(