README.md in whirled_peas-0.5.0 vs README.md in whirled_peas-0.6.0

- old
+ new

@@ -1,11 +1,27 @@ [![Build Status](https://travis-ci.com/tcollier/whirled_peas.svg?branch=main)](https://travis-ci.com/tcollier/whirled_peas) -# WhirledPeas +``` + ██╗ ██╗██╗███████╗██╗ ██╗ █████╗ ██╗ ██╗███████╗███████╗ + ██║ ██║██║██╔════╝██║ ██║██╔══██╗██║ ██║╚══███╔╝██╔════╝ + ██║ ██║██║███████╗██║ ██║███████║██║ ██║ ███╔╝ █████╗ + ╚██╗ ██╔╝██║╚════██║██║ ██║██╔══██║██║ ██║ ███╔╝ ██╔══╝ + ╚████╔╝ ██║███████║╚██████╔╝██║ ██║███████╗██║███████╗███████╗ + ╚═══╝ ╚═╝╚══════╝ ╚═════╝ ╚═╝ ╚═╝╚══════╝╚═╝╚══════╝╚══════╝ -Visualize your code's execution with Whirled Peas! + your code's execution with + ██╗ ██╗██╗ ██╗██╗██████╗ ██╗ ███████╗██████╗ ██████╗ ███████╗ █████╗ ███████╗ + ██║ ██║██║ ██║██║██╔══██╗██║ ██╔════╝██╔══██╗ ██╔══██╗██╔════╝██╔══██╗██╔════╝ + ██║ █╗ ██║███████║██║██████╔╝██║ █████╗ ██║ ██║ ██████╔╝█████╗ ███████║███████╗ + ██║███╗██║██╔══██║██║██╔══██╗██║ ██╔══╝ ██║ ██║ ██╔═══╝ ██╔══╝ ██╔══██║╚════██║ + ╚███╔███╔╝██║ ██║██║██║ ██║███████╗███████╗██████╔╝ ██║ ███████╗██║ ██║███████║ + ╚══╝╚══╝ ╚═╝ ╚═╝╚═╝╚═╝ ╚═╝╚══════╝╚══════╝╚═════╝ ╚═╝ ╚══════╝╚═╝ ╚═╝╚══════╝ +``` + +Easily create terminal-based graphics to visual the execution of your code. Whirled Peas offers templating inspired by HTML and CSS and provides a lightweight tie-in for your code to produce visual animations with these templates. + ## Installation Add this line to your application's Gemfile: ```ruby @@ -154,16 +170,16 @@ `WhirledPeas.configure` takes an optional template factory to build a loading screen. This instance must implement `#build` (taking no arguments). The template returned by that method will be painted while the event loop is waiting for frames. The factory method will be called once per refresh cycle, so it's possible to implement animation. #### Building Blocks -A template is created with `WhirledPeas.template`, which yields a `Composer` object for a `BoxElement` and `BoxSettings`. The composer allows for attaching child elements and the settings for setting layout options. +A template is created with `WhirledPeas.template`, which yields a `Composer` object for a `Box` and `BoxSettings`. The composer allows for attaching child elements and the settings for setting layout options. A `Composer` provides the following methods to add child elements, each of these takes an optional string argument that is set as the name of the element (which can be useful when debugging). -- `add_box` - yields a `Composer` and a `BoxSettings`, which will be added to the parent's children -- `add_grid` - yields a `Composer` and a `GridSettings`, which will be added to the parent's children +- `add_box` - yields a `Composer` for a `Box` and a `BoxSettings`, which will be added to the parent's children +- `add_grid` - yields a `Composer` for a `Grid` and a `GridSettings`, which will be added to the parent's children - `add_text` - yields `nil` and a `TextSettings`, which will be added to the parent's children E.g. ```ruby @@ -190,11 +206,11 @@ settings.bg_color = :blue composer.add_grid(&method(:number_grid)) end ``` -Additionally, if no child element is explicitly added to a `GridElement`, but the block returns an array of strings or numbers, those will be converted to `TextElements` and added as children to the `GridElement`. For example, these are identical ways to create a grid of strings +Additionally, if no child element is explicitly added to a `Grid`, but the block returns an array of strings or numbers, those will be converted to `Text` elements and added as children to the `Grid`. For example, these are identical ways to create a grid of strings ```ruby template.add_grid do |composer| 100.times do |i| composer.add_text { i } @@ -204,11 +220,11 @@ template.add_grid do 100.times.map(&:itself) end ``` -Similarly, if no child element is explicilty added to a `BoxElement`, but the block returns a string or number, that value will be converted to a `TextElement` and added as a child. For example, these are identical ways to create a box with string content +Similarly, if no child element is explicilty added to a `Box`, but the block returns a string or number, that value will be converted to a `Text` and added as a child. For example, these are identical ways to create a box with string content ```ruby template.add_box do |composer| composer.add_text { "Hello!" } end @@ -234,10 +250,11 @@ | `height` | Override the calculated height of an element's content area | | `Box`, `Grid` | No | | `margin` | Set the (left, top, right, bottom) margin of the element | `0` | `Box`, `Grid` | No | | `num_cols` | Number of columns in the grid (must be set!) | | `Grid` | No | | `padding` | Set the (left, top, right, bottom) padding of the element | `0` | `Box`, `Grid` | No | | `position` | Set the (left, top) position of the element relative to parent content area | `0` | `Box`, `Grid` | No | +| `scrollbar` | Display a scroll bar for vertical or horizontal scrolling | | `Box` | No | | `title_font` | Font used for "large" text (see [Large Text](#large-text), ignores `underline`) | | `Text` | No | | `underline` | `true` underlines the font | `false` | `Box`, `Grid`, `Text` | Yes | | `width` | Override the calculated width of an element's content area | | `Box`, `Grid` | No | ##### Position @@ -260,10 +277,16 @@ - `set_padding(left:, top:, right:, bottom:)` Note: values cannot be negative +##### Scrollbar + +Scroll settings dictate whether the scrollbar will be shown when child content is larger the the container's viewport. A scrollbar adds a unit to the dimensions of a container (as opposed to overwriting the leftmost/bottommost padding) + +- `set_padding(horiz:, vert:)` + ##### Border The border settings consist of 6 boolean values (border are either width 1 or not shown), the 4 obvious values (`left`, `top`, `right`, and `bottom`) along with 2 other values for inner borders (`inner_horiz` and `inner_vert`) in a grid. A border also has a foreground color (defaults to `:white`) and a style. The background color is determined by the `bg_color` of the element. Border values can be set with - `set_border(left:, top:, right:, bottom:, inner_horiz:, inner_vert:, color:, style:)` @@ -306,35 +329,57 @@ Child elements can flow in one of 4 directions - `:l2r` left-to-right ``` +# In a Box [child 1] [child 2] ... [child N] + +# In a Grid +[child 1] [child 2] [child 3] +[chiid 4] [child 5] ``` - `:r2l` right-to-left ``` +# In a Box [child N] [child N - 1] ... [child 1] + +# In a Grid +[child 3] [child 2] [child 1] + [chiid 5] [child 4] ``` - `:t2b` top-to-bottom ``` +# In a Box [child 1] [child 2] ... [child N] + +# In a Grid +[child 1] [child 4] +[child 2] [child 5] +[child 3] ``` - `:b2t` bottom-to-top ``` +# In a Box [child N] [child N - 1] ... [child 1] + +# In a Grid +[child 3] +[child 2] [child 5] +[child 1] [child 4] ``` ##### Colors Below is the list of available colors (for both foreground and background) @@ -358,11 +403,11 @@ - `:bright_red` - `:bright_yellow` ##### Large Text -The `title_font` setting for `TextElement`s converts the standard terminal font into a large block font. The available fonts vary from system to system. Every system will have a `:default` font available, this font could look like +The `title_font` setting for `Text`s converts the standard terminal font into a large block font. The available fonts vary from system to system. Every system will have a `:default` font available, this font could look like ``` ██████╗ ███████╗███████╗ █████╗ ██╗ ██╗██╗ ████████╗ ██╔══██╗██╔════╝██╔════╝██╔══██╗██║ ██║██║ ╚══██╔══╝ ██║ ██║█████╗ █████╗ ███████║██║ ██║██║ ██║ @@ -453,52 +498,39 @@ Adding the `--template` flag will result in printing out debug information for the template, e.g. ``` $ whirled_peas <config file> play_frame move '{"direction":"N"}' --template -+ TEMPLATE [WhirledPeas::Template::BoxElement] - - Settings - WhirledPeas::Settings::BoxSettings - <default> - - Children - + TitleContainer [WhirledPeas::Template::BoxElement] -... -``` - -Adding the `--painter` flag will result in printing out debug information the painter (the rendered template), e.g. - -``` -$ whirled_peas <config file> play_frame move '{"direction":"N"}' --painter + TEMPLATE [WhirledPeas::Graphics::BoxPainter] - Settings WhirledPeas::Settings::BoxSettings <default> - - Dimensions - - Canvas: - Children + TitleContainer [WhirledPeas::Graphics::BoxPainter] ... ``` +Note: the `list_frames` command will print out frame names and arguments formatted for this command + #### loading Displays the configured loading screen for several seconds ``` $ whirled_peas <config file> loading ``` -Adding the `--debug` flag will result in just printing out the loading template's debug information, e.g. +Adding the `--template` flag will result in just printing out the loading template's debug information, e.g. ``` -$ whirled_peas <config file> loading --debug -+ TEMPLATE [WhirledPeas::UI::Template] +$ whirled_peas <config file> loading --template ++ TEMPLATE [WhirledPeas::Graphics::BoxPainter] - Settings - WhirledPeas::UI::TemplateSettings + WhirledPeas::Settings::BoxSettings <default> - Children - + TitleContainer [WhirledPeas::UI::BoxElement] + + TitleContainer [WhirledPeas::Graphics::BoxPainter] ... ``` ## Development @@ -513,10 +545,11 @@ Note: viewing `.frame` files with `cat` works better than most other text editors. The following rake tasks are provided to interact with the screen tests - `screen_test` runs all screen tests in the `screen_test/rendered` directory -- `screen_test:debug[path/to/file.rb]` print the rendered template debug tree +- `screen_test:debug[path/to/file.rb]` render the screen without printing it, this allows for debug print statments in the code to appear in the terminal +- `screen_test:template[path/to/file.rb]` print the rendered template debug tree - `screen_test:run[path/to/file.rb]` runs a single screen test - `screen_test:save[path/to/file.rb]` saves the output generated by the template in the `.frame` file, overwriting any existing file - `screen_test:view[path/to/file.rb]` views the output generated by the template - `screen_test:update_all[path/to/file.rb]` interactively step through each pending or failed screen test to compare/set the expected output