Skip to content

Commit

Permalink
Demo updates (#212)
Browse files Browse the repository at this point in the history 
* Remove frameRate from demo

* Expand chart demo page

* Update snapshots
  • Loading branch information
@dantleech
dantleech committed Dec 2, 2023
1 parent 448b99c commit 028505b
Show file tree
Hide file tree
Showing 12 changed files with 96 additions and 88 deletions.
48 changes: 7 additions & 41 deletions example/demo/src/App.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,10 +36,8 @@
use PhpTui\Tui\Layout\Constraint;
use PhpTui\Tui\Style\Style;
use PhpTui\Tui\Text\Line;
use PhpTui\Tui\Text\Title;
use PhpTui\Tui\Widget\Borders;
use PhpTui\Tui\Widget\Direction;
use PhpTui\Tui\Widget\HorizontalAlignment;
use PhpTui\Tui\Widget\Widget;
use Throwable;

Expand All @@ -61,14 +59,12 @@ final class App
{
/**
* @param array<string,Component> $pages
* @param int[] $frameSamples
*/
private function __construct(
private Terminal $terminal,
private Display $display,
private ActivePage $activePage,
private array $pages,
private array $frameSamples,
) {
}

Expand Down Expand Up @@ -106,7 +102,6 @@ public static function new(?Terminal $terminal = null, ?Backend $backend = null)
$display,
ActivePage::Events,
$pages,
[],
);
}

Expand All @@ -115,12 +110,19 @@ public function run(): int
try {
// enable "raw" mode to remove default terminal behavior (e.g.
// echoing key presses)
// hide the cursor
$this->terminal->execute(Actions::cursorHide());
// switch to the "alternate" screen so that we can return the user where they left off
$this->terminal->execute(Actions::alternateScreenEnable());
$this->terminal->execute(Actions::enableMouseCapture());
$this->terminal->enableRawMode();

return $this->doRun();
} catch (Throwable $err) {
$this->terminal->disableRawMode();
$this->terminal->execute(Actions::disableMouseCapture());
$this->terminal->execute(Actions::alternateScreenDisable());
$this->terminal->execute(Actions::cursorShow());
$this->terminal->execute(Actions::clear(ClearType::All));

throw $err;
Expand All @@ -129,11 +131,6 @@ public function run(): int

private function doRun(): int
{
// hide the cursor
$this->terminal->execute(Actions::cursorHide());
// switch to the "alternate" screen so that we can return the user where they left off
$this->terminal->execute(Actions::alternateScreenEnable());
$this->terminal->execute(Actions::enableMouseCapture());

// the main loop
while (true) {
Expand Down Expand Up @@ -197,7 +194,6 @@ private function doRun(): int
}

$this->display->draw($this->layout());
$this->incFramerate();

// sleep for Xms - note that it's encouraged to implement apps
// using an async library such as Amp or React
Expand Down Expand Up @@ -235,7 +231,6 @@ private function header(): Widget
{
return BlockWidget::default()
->borders(Borders::ALL)->style(Style::default()->white())
->titles(Title::fromString(sprintf('%d FPS', $this->frameRate()))->horizontalAlignmnet(HorizontalAlignment::Right))
->widget(
TabsWidget::fromTitles(
Line::parse('<fg=red>[q]</>uit'),
Expand All @@ -247,33 +242,4 @@ private function header(): Widget
)->select($this->activePage->index() + 1)->highlightStyle(Style::default()->white()->onBlue())
);
}

private function incFramerate(): void
{
$this->frameSamples[] = time();
}

private function frameRate(): float
{
if (count($this->frameSamples) === 0) {
return 0.0;
}

$time = time();
foreach ($this->frameSamples as $i => $frameRate) {
if ($frameRate < $time - 2) {
unset($this->frameSamples[$i]);
}
}
$bySecond = array_reduce($this->frameSamples, function (array $ac, int $timestamp) {
if (!isset($ac[$timestamp])) {
$ac[$timestamp] = 0;
}
$ac[$timestamp]++;

return $ac;
}, []);

return array_sum($bySecond) / count($bySecond);
}
}
90 changes: 66 additions & 24 deletions example/demo/src/Page/ChartPage.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,8 @@
use PhpTui\Tui\Extension\Core\Widget\Chart\AxisBounds;
use PhpTui\Tui\Extension\Core\Widget\Chart\DataSet;
use PhpTui\Tui\Extension\Core\Widget\ChartWidget;
use PhpTui\Tui\Extension\Core\Widget\GridWidget;
use PhpTui\Tui\Layout\Constraint;
use PhpTui\Tui\Style\Style;
use PhpTui\Tui\Text\Line;
use PhpTui\Tui\Text\Span;
Expand All @@ -31,39 +33,79 @@ public function build(): Widget
Span::styled('two', Style::default()),
Span::styled('three', Style::default()),
];
$dataSets = [
$dataSets1 = [
DataSet::new('data1')
->marker(Marker::Dot)
->style(Style::default()->cyan())
->data($this->sinData(0)),
DataSet::new('data1')
DataSet::new('data2')
->marker(Marker::Braille)
->style(Style::default()->yellow())
->data($this->sinData(90)),
];
$dataSets2 = [
DataSet::new('data1')
->marker(Marker::HalfBlock)
->style(Style::default()->green())
->data($this->sinData(45)),
DataSet::new('data2')
->marker(Marker::Block)
->style(Style::default()->blue())
->data($this->sinData(135)),
];

return BlockWidget::default()
->titles(Title::fromLine(Line::fromString('Chart 1')))
->borders(Borders::ALL)
->widget(
ChartWidget::new(...$dataSets)
->xAxis(
Axis::default()
//->title('X Axis')
->style(Style::default()->gray())
->labels(...$xLabels)
->bounds(AxisBounds::new(0, 400))
)
->yAxis(
Axis::default()
//->title('X Axis')
->style(Style::default()->gray())
->labels(
Span::fromString('-20'),
Span::fromString('0'),
Span::fromString('20'),
)
->bounds(AxisBounds::new(-400, 400))
return GridWidget::default()
->constraints(
Constraint::percentage(50),
Constraint::percentage(50),
)
->widgets(
BlockWidget::default()
->titles(Title::fromLine(Line::fromString('Chart 1')))
->borders(Borders::ALL)
->widget(
ChartWidget::new(...$dataSets1)
->xAxis(
Axis::default()
//->title('X Axis')
->style(Style::default()->gray())
->labels(...$xLabels)
->bounds(AxisBounds::new(0, 400))
)
->yAxis(
Axis::default()
//->title('X Axis')
->style(Style::default()->gray())
->labels(
Span::fromString('-20'),
Span::fromString('0'),
Span::fromString('20'),
)
->bounds(AxisBounds::new(-400, 400))
)
),
BlockWidget::default()
->titles(Title::fromLine(Line::fromString('Chart 2')))
->borders(Borders::ALL)
->widget(
ChartWidget::new(...$dataSets2)
->xAxis(
Axis::default()
->style(Style::default()->gray())
->labels(...$xLabels)
->bounds(AxisBounds::new(0, 400))
)
->yAxis(
Axis::default()
//->title('X Axis')
->style(Style::default()->gray())
->labels(
Span::fromString('-20'),
Span::fromString('0'),
Span::fromString('20'),
)
->bounds(AxisBounds::new(-400, 400))
)
)
);
}
Expand Down
2 changes: 1 addition & 1 deletion tests/Example/snapshot/BarChart.snapshot
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
┌─────────────────────────────────────────────────────────────────────────0 FPS┐
┌──────────────────────────────────────────────────────────────────────────────┐
│ [q]uit │ events │ canvas │ chart │ list │ table │ blocks │ sprite │ colors │ │
└──────────────────────────────────────────────────────────────────────────────┘
▁▁▁▁▁▁▁▁▁▁ ██1 12█████████████████
Expand Down
2 changes: 1 addition & 1 deletion tests/Example/snapshot/Blocks.snapshot
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
┌─────────────────────────────────────────────────────────────────────────0 FPS┐
┌──────────────────────────────────────────────────────────────────────────────┐
│ [q]uit │ events │ canvas │ chart │ list │ table │ blocks │ sprite │ colors │ │
└──────────────────────────────────────────────────────────────────────────────┘
┌Borders::ALL──────────────────────────┐Borders::NONE
Expand Down
2 changes: 1 addition & 1 deletion tests/Example/snapshot/Canvas.snapshot
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
┌─────────────────────────────────────────────────────────────────────────0 FPS┐
┌──────────────────────────────────────────────────────────────────────────────┐
│ [q]uit │ events │ canvas │ chart │ list │ table │ blocks │ sprite │ colors │ │
└──────────────────────────────────────────────────────────────────────────────┘
┌World─────────────────────────────────────────────────────────────────────────┐
Expand Down
28 changes: 14 additions & 14 deletions tests/Example/snapshot/Chart.snapshot
View file
Original file line number Diff line number Diff line change
@@ -1,20 +1,20 @@
┌─────────────────────────────────────────────────────────────────────────0 FPS┐
┌──────────────────────────────────────────────────────────────────────────────┐
│ [q]uit │ events │ canvas │ chart │ list │ table │ blocks │ sprite │ colors │ │
└──────────────────────────────────────────────────────────────────────────────┘
┌Chart 1───────────────────────────────────────────────────────────────────────┐
│ 20│ ••• ⡜⠙⡄ ••• ⢀⠏⠣ ••• ⡸⠙⡄ ••• ⠠⠊⢣ ••• ⠜⠙⡄ •• ⢀⠏⢣ ••• │
│ │ • •• ⠠⠂ ⢂ • • ⠌ ⠈⡂ • •• ⢀⠅ ⢑ • • ⡘ ⠅ • •⢀⠃ ⠡ • •⠔ ⠆•• • │
│ │•• • ⠨ ⠈⠄• • ⠅ ⢂• • ⢐ ⠐⡀• • ⡂ ⠑• ⢐ ⠈⠄ • •⠅ ⠡• • │
│ │• • ⠅ ⡂• • ⠨ ⢐• • ⠄ ⠂• • ⠐ ⠨• ⡂ ⠅ •• ⢈• ⢈• • ⠄│
│ │⡂ ••⢐ ⠐ • ⡈ ⠄ ••⠠⠁ ⠨ • ⠨ ⡁ ⠐•• ⢐ • ⠐• •⡂ • ⢀⠂│
│ │⠄ •⠠ ⠨ • ⠂ •⢁ •⢐ ⠐⡀ • ⡁ •⠂ ⢈ • ⠐ • ⠅• •⠠ ••⠠ │
│ 0│⢈ •⡁ •⡂ ⠠⠁ •⠐ •⠄ ••⠄ •⠐ •⠨ ⠂ • ⠅•• ⢀⠂•• •⢈ •⡈ │
│ │⠐ ⠂ • ⠄ ⡐ •⠈⠄ •⡁ • ⢁ ⠨ • ⡂ •• ⠂• ⠠ • ⠂ •⠂ │
│ │ ⠅ ⠨• • ⢈ ⠄ •• ⡂ ⠐• • ⠐ ⡂ • ⠄ • ⠨• ⠅ • ⠅ ⠠⠁ │
│ │ ⢂ ⡈• • ⡂ ⠠⠁• • ⠐ ⠌• • ⠅ ⠄• • ⠨ • •⠅ ⢀⠂ •• ⢐ ⡈• │
│ │ ⠐⡀ ⢀⠂•• • ⢂ ⠨ • •• ⠨⡀ ⠅•• • ⠡ ⠨ • •• ⠈⠄ •• •⢂ ⢐ • ⠐⡀ ⡂• │
│ │ ⢆ ⡨ ••• ⠰ ⢀⠅ ••• ⢂ ⢘ ••• ⠘⡀ ⡊ ••• ⢡ •••⠨⡀ ⠆ •• ⢢ ⢨ │
│-20│ ⠐⠤⠃ ⠳⠜ ⠘⠤⠇ ⠣⠼ ⠈⠆ ⠱⠜ ⠐⠦⠇ │
│ 20│••••• ⣰⠋⠉⠣⡀••••• ⢀⠞⠉⠙⢆••••• ⢠⠋⠉⠳⡀••••• ⡜⠉⠉⢦••••⣠⠋⠉⠳⡀ ••••⢀⡔⠉⠙⢆••••• │
│ │⢆ ••⡰⠁ •⠱⡀ •⢀⡎ ⠈⢦ ••⣰⠁ •⠹⡄ •⢀⠜ ⠈⢇ ⡰⠁•• ⠱⡀•• ⡞•• ⠈⢢ ••⣰⠃│
│ 0│⠈⢆ ⡰⠁•••• ⠱⡀ ⢀⠎•••••⠈⢆ ⡰⠃•••• ⠑⡄ ⢀⡞•••• ⢧ •••⠱⡄ ⢀⠎ •••⠈⢧ ⡠⠃ │
│-20│ ⠈⠣⠤⠜⠁ ⠙⠤⠴⠊ ⠈⠳⠤⠔⠁ ⠘⠦⠤⠊ ⠳⠄ ⠙⠤⠤⠊ ⠈⠳⠤⠴⠁ │
│ └──────────────────────────────────────────────────────────────────────────│
│ one two three │
└──────────────────────────────────────────────────────────────────────────────┘
┌Chart 2───────────────────────────────────────────────────────────────────────┐
│ 20│███ █▀▀█ █████▄█▀█▄ ████ █▀▀▄ █████▄█▀█████ █▀▀████ █▀▀█ █████▄█▀▀ │
│ │ ██▀ ▀███ ██ █ █ ██▀ ▀███ ██ ██ ██ █▀ ███ ██ ███ ██ │
│ 0│ █▀█ ██ ███ █ ███ ██ ▄████ █ ███▀ ██ █▄ ▀█ ██ ███ │
│ │ ▄▀ █████▀▄ ▄█ ██████ ▄▀ ██████▄ ▄█ ██ ▀█ █████ █▄ ████▀█ █▀ ███ │
│-20│▀▀ ▀▀▀ ▀▀▀ ▀▀▀ ▀▀▀▀ ▀▀ ▀▀▀ │
│ └──────────────────────────────────────────────────────────────────────────│
│ one two three │
└──────────────────────────────────────────────────────────────────────────────┘
2 changes: 1 addition & 1 deletion tests/Example/snapshot/Colors.snapshot
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
┌─────────────────────────────────────────────────────────────────────────0 FPS┐
┌──────────────────────────────────────────────────────────────────────────────┐
│ [q]uit │ events │ canvas │ chart │ list │ table │ blocks │ sprite │ colors │ │
└──────────────────────────────────────────────────────────────────────────────┘
#803e3e #80403e #80413e #80423e #80433e #80443e #80453e #80463e #80473e
Expand Down
2 changes: 1 addition & 1 deletion tests/Example/snapshot/Gauge.snapshot
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
┌─────────────────────────────────────────────────────────────────────────0 FPS┐
┌──────────────────────────────────────────────────────────────────────────────┐
│ [q]uit │ events │ canvas │ chart │ list │ table │ blocks │ sprite │ colors │ │
└──────────────────────────────────────────────────────────────────────────────┘
┌Downloading 13 files──────────────────────────────────────────────────────────┐
Expand Down

0 comments on commit 028505b

Please sign in to comment.