Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat(examples): add demo2 example #500

Merged
merged 1 commit into from Sep 21, 2023
Merged

feat(examples): add demo2 example #500

merged 1 commit into from Sep 21, 2023

Conversation

joshka
Copy link
Member

@joshka joshka commented Sep 13, 2023 •
edited

This is example is aimed at creating a github social preview image and
eventually replacing the current main demo.

outdated images https://github.com/ratatui-org/ratatui/assets/381361/8255624d-9237-44da-8655-a489aaf5e1e5

Made with VHS

Demo

demo2

@codecov
Copy link

codecov bot commented Sep 13, 2023 •
edited

Codecov Report

Merging #500 (6ed7c03) into main (c9b8e7c) will not change coverage.
The diff coverage is n/a.

@@           Coverage Diff           @@
##             main     #500   +/-   ##
=======================================
  Coverage   90.00%   90.00%           
=======================================
  Files          40       40           
  Lines       11190    11190           
=======================================
  Hits        10072    10072           
  Misses       1118     1118

@joshka joshka changed the title feat(examples): add demo2 example wip(examples): add demo2 example Sep 13, 2023
@joshka joshka changed the title wip(examples): add demo2 example feat(examples): add demo2 example Sep 14, 2023
@joshka joshka force-pushed the feat-demo2 branch 2 times, most recently from 04c07c7 to f319f69 Compare September 14, 2023 07:55
@joshka
Copy link
Member Author

joshka commented Sep 14, 2023 •
edited

Current state (in the middle of rejigging it based on the ideas - so just tab1 and 3 are updated right now):

Old demo
demo2.mp4

Made with VHS

@joshka
Copy link
Member Author

joshka commented Sep 15, 2023 •
edited

Old demo image

@joshka joshka force-pushed the feat-demo2 branch 2 times, most recently from 8cea883 to e4c3732 Compare September 15, 2023 14:52
@joshka
Copy link
Member Author

joshka commented Sep 15, 2023 •
edited

Old demo

Made with VHS

@joshka joshka marked this pull request as ready for review September 15, 2023 15:51
@kdheepak
Copy link
Collaborator

I like how the About tab's Paragraph has padding. I think the Recipe tab could use padding as well. If fitting the recipe on screen is important, then maybe we can change the font size in vhs?

@joshka
Copy link
Member Author

joshka commented Sep 16, 2023 •
edited

Feedback incorporated in d8b3f47

Old demo

Demo

@joshka
Copy link
Member Author

joshka commented Sep 16, 2023 •
edited

Old demo

Made with VHS

@joshka
Copy link
Member Author

joshka commented Sep 17, 2023 •
edited

Old demo

Made with VHS

@joshka
Copy link
Member Author

joshka commented Sep 17, 2023 •
edited

Old demo

Made with VHS

@joshka joshka force-pushed the feat-demo2 branch 3 times, most recently from cccf2ad to 47ad830 Compare September 17, 2023 02:23
@joshka
Copy link
Member Author

joshka commented Sep 17, 2023 •
edited

Updated the readme and lib.rs and the social preview.

outdated image image

@orhun
Copy link
Sponsor Member

orhun commented Sep 17, 2023

Ping @sayanarijit @mindoodoo for review.

@joshka
Copy link
Member Author

joshka commented Sep 18, 2023

Just updated the actual preview image (lots of work went into making the last tab nicer bouncing ideas off @kdheepak the other day. Aiming for a bit more of a modern feel rather than just pure boxes and colored text. I particularly was fond of the way the scrollbars turned out.

There's probably some rough edges in this that are not production grade, so I'd suggest we keep the old demo around as well. This is a "What's possible" type demo that hopefully inspires some more awesome looking Ratatui Apps.

joshka
joshka commented Sep 18, 2023
View reviewed changes
Copy link
Member Author

@joshka joshka left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm just reading through this PR from top to bottom for the first time and figured I'd leave some review notes.

Cargo.toml Outdated Show resolved Hide resolved
Cargo.toml Outdated Show resolved Hide resolved
README.md Outdated Show resolved Hide resolved
examples/demo2/app.rs Show resolved Hide resolved
examples/demo2/app.rs Outdated Show resolved Hide resolved
examples/demo2/tabs/weather.rs Outdated Show resolved Hide resolved
examples/demo2/term.rs Show resolved Hide resolved
examples/demo2/term.rs Outdated Show resolved Hide resolved
examples/demo2/theme.rs Outdated Show resolved Hide resolved
examples/demo2/theme.rs Show resolved Hide resolved
@joshka joshka mentioned this pull request Sep 18, 2023
Closed
@joshka
Copy link
Member Author

joshka commented Sep 18, 2023

Pinging @nawok for thoughts on the logo in this

@nawok
Copy link

nawok commented Sep 19, 2023 •
edited

Looks nice. I don't know how this is implemented (manually painted pixels or a programmatically downscaled bitmap), but I think it would look cleaner with some pixels added or moved:

image

@joshka
Copy link
Member Author

joshka commented Sep 20, 2023

Required a rebase to fixup against the barchart fix. So I squashed it all.

@joshka
Copy link
Member Author

joshka commented Sep 20, 2023

Rebase broke things - undid that. Will fix this up tomorrow.

@joshka
Copy link
Member Author

joshka commented Sep 20, 2023

Looks nice. I don't know how this is implemented (manually painted pixels or a programmatically downscaled bitmap), but I think it would look cleaner with some pixels added or moved:

I wrote up a much longer reply to this, but accidentally closed the tab without sending.
Thanks for the feedback - I made the suggested changes.
The process was all pretty manual (pixel editing in gimp -> c header export -> regex -> rust array -> manual tweaks -> adding the eye animation). More effort than was really required to make a demo, but I think the payoff was worth it.

@joshka
Copy link
Member Author

joshka commented Sep 20, 2023 •
edited

outdated images ![demo2-about](https://github.com/ratatui-org/ratatui/assets/381361/ca1f07dc-2e9f-47ca-9277-368782d8b2ff) ![demo2-recipe](https://github.com/ratatui-org/ratatui/assets/381361/4218e8b9-7b79-4d02-a024-7f8afc61f62c) ![demo2-email](https://github.com/ratatui-org/ratatui/assets/381361/e503ca53-e445-43a1-99e6-a917dbf19352) ![demo2-trace](https://github.com/ratatui-org/ratatui/assets/381361/cfc06085-f1d5-4b18-8258-b8ab8ea9546f) ![demo2-weather](https://github.com/ratatui-org/ratatui/assets/381361/aa9e2559-3576-48d6-a4c7-89c8eaef3200)

GIF
demo2
Social GIF
demo2-social

orhun
orhun reviewed Sep 20, 2023
View reviewed changes
examples/demo2/app.rs Outdated Show resolved Hide resolved
src/lib.rs Outdated Show resolved Hide resolved
joshka added a commit that referenced this pull request Sep 20, 2023
@joshka
fix: more tweaks based on PR comments
8096177 
#500 (review)

- add comments
- remove dead code (in colors and weather)
- make RGB swatch into a widget
- simplify the RGB logic in the swatch / weather gauge
- move layout() helper function to root module
- remove unused keyboard bindings
- remove unused imports in theme
- remove unused lipsum crate
- turn on doc scraping
@joshka
feat(examples): add demo2 example
6ed7c03 
This is a more modern styled example that avoids the standard borders
and uses a more modern color scheme. The example is sized to fit a
social preview image and to use up less vertical space in other
documentation.
@joshka
Copy link
Member Author

joshka commented Sep 20, 2023

demo2-about
demo2-recipe
demo2-email
demo2-trace
demo2-weather
demo2
demo2-social

orhun
orhun approved these changes Sep 21, 2023
View reviewed changes
Copy link
Sponsor Member

@orhun orhun left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🧀

@joshka joshka merged commit be55a5f into main Sep 21, 2023
36 checks passed
@joshka joshka deleted the feat-demo2 branch December 10, 2023 00:25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@kdheepak kdheepak kdheepak left review comments

@orhun orhun orhun approved these changes

@mindoodoo mindoodoo Awaiting requested review from mindoodoo

@sayanarijit sayanarijit Awaiting requested review from sayanarijit

@sophacles sophacles Awaiting requested review from sophacles

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

None yet
4 participants
@joshka @kdheepak @orhun @nawok