zhangyiss/FTXUI
1
0
Fork 0
mirror of https://github.com/ArthurSonzogni/FTXUI.git synced 2025-12-16 01:48:56 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Compare commits

base: zhangyiss:b988a8a3b1b7bfe8fa6d710aae05ea25f87cf3a9
Branches Tags
zhangyiss:main zhangyiss:gh-pages zhangyiss:copilot/fix-1118 zhangyiss:HarryPehkonen/main zhangyiss:failed-v6.0.0 zhangyiss:v5.1.0 zhangyiss:Version_5.1 zhangyiss:support-v4
zhangyiss:v6.1.9 zhangyiss:v6.1.8 zhangyiss:v6.1.7 zhangyiss:v6.1.6 zhangyiss:v6.1.5 zhangyiss:v6.1.4 zhangyiss:v6.1.3 zhangyiss:v6.1.2 zhangyiss:v6.1.1 zhangyiss:v6.1.0 zhangyiss:v6.0.2 zhangyiss:v6.0.1 zhangyiss:v6.0.0 zhangyiss:failed-v6.0.0 zhangyiss:v5.0.0 zhangyiss:v4.1.1 zhangyiss:v4.1.0 zhangyiss:v4.0.0 zhangyiss:v3.0.0 zhangyiss:v2.0.0 zhangyiss:v0.11 zhangyiss:v0.10 zhangyiss:v0.9
..
compare: zhangyiss:18f6f9cd904a1260cb2094197fee79e25e1f0ca7
Branches Tags
zhangyiss:gh-pages zhangyiss:main zhangyiss:copilot/fix-1118 zhangyiss:HarryPehkonen/main zhangyiss:failed-v6.0.0 zhangyiss:v5.1.0 zhangyiss:Version_5.1 zhangyiss:support-v4
zhangyiss:v6.1.9 zhangyiss:v6.1.8 zhangyiss:v6.1.7 zhangyiss:v6.1.6 zhangyiss:v6.1.5 zhangyiss:v6.1.4 zhangyiss:v6.1.3 zhangyiss:v6.1.2 zhangyiss:v6.1.1 zhangyiss:v6.1.0 zhangyiss:v6.0.2 zhangyiss:v6.0.1 zhangyiss:v6.0.0 zhangyiss:failed-v6.0.0 zhangyiss:v5.0.0 zhangyiss:v4.1.1 zhangyiss:v4.1.0 zhangyiss:v4.0.0 zhangyiss:v3.0.0 zhangyiss:v2.0.0 zhangyiss:v0.11 zhangyiss:v0.10 zhangyiss:v0.9

1 Commits
b988a8a3b1 ... 18f6f9cd90

Author SHA1 Message Date
Alex
18f6f9cd90 Merge baa5973128 into d20b84f720 2025-08-18 13:51:33 +03:00
7 changed files with 80 additions and 195 deletions
Expand all files Collapse all files

2
CHANGELOG.md
View File

@@ -29,8 +29,6 @@ Next
### Component ### Component
- Fix ScreenInteractive::FixedSize screen stomps on the preceding terminal - Fix ScreenInteractive::FixedSize screen stomps on the preceding terminal
output. Thanks @zozowell in #1064. output. Thanks @zozowell in #1064.
- Fix vertical `ftxui::Slider`. The "up" key was previously decreasing the
value. Thanks @its-pablo in #1093 for reporting the issue.
6.1.9 (2025-05-07) 6.1.9 (2025-05-07)

2
CMakeLists.txt
View File

@@ -178,8 +178,8 @@ include(cmake/ftxui_install.cmake)
include(cmake/ftxui_package.cmake) include(cmake/ftxui_package.cmake)
include(cmake/ftxui_modules.cmake) include(cmake/ftxui_modules.cmake)
add_subdirectory(examples)
add_subdirectory(doc) add_subdirectory(doc)
add_subdirectory(examples)
# You can generate ./examples_modules/ by running # You can generate ./examples_modules/ by running
# ./tools/generate_examples_modules.sh # ./tools/generate_examples_modules.sh

6
examples/CMakeLists.txt
View File

@@ -17,12 +17,10 @@ add_subdirectory(dom)
if (EMSCRIPTEN) if (EMSCRIPTEN)
get_property(EXAMPLES GLOBAL PROPERTY FTXUI::EXAMPLES) get_property(EXAMPLES GLOBAL PROPERTY FTXUI::EXAMPLES)
foreach(file foreach(file
"index.css"
"index.html" "index.html"
"index.mjs" "index.mjs"
"run_webassembly.py" "index.css"
"sw.js" "run_webassembly.py")
)
configure_file(${file} ${file}) configure_file(${file} ${file})
endforeach(file) endforeach(file)
endif() endif()

77
examples/index.css
View File

@@ -1,9 +1,5 @@
@import url(https://fonts.googleapis.com/css?family=Khula:700); @import url(https://fonts.googleapis.com/css?family=Khula:700);
html {
--toc-width: 250px;
}
body { body {
background-color:#EEE; background-color:#EEE;
padding:0px; padding:0px;
@@ -45,8 +41,7 @@ h1 {
flex:1; flex:1;
} }
#selectExample, #selectExample, #selectExample option {
#selectExample option {
font-size: 16px; font-size: 16px;
font-family: sans-serif; font-family: sans-serif;
font-weight: 700; font-weight: 700;
@@ -66,8 +61,7 @@ h1 {
height: calc(clamp(200px, 100vh - 300px, 900px)); height: calc(clamp(200px, 100vh - 300px, 900px));
overflow: hidden; overflow: hidden;
border:none; border:none;
padding: 10px; background-color:black;
margin: 10px;
} }
#terminalContainer { #terminalContainer {
@@ -75,7 +69,6 @@ h1 {
border-radius: 10px; border-radius: 10px;
box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.75), box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.75),
0px 2px 80px 0px rgba(0,0,0,0.50); 0px 2px 80px 0px rgba(0,0,0,0.50);
background-color: black;
} }
.fakeButtons { .fakeButtons {
@@ -112,69 +105,3 @@ h1 {
margin: 0 auto; margin: 0 auto;
overflow: hidden; overflow: hidden;
} }
.toc-container {
position: fixed;
left: 0;
top: 0;
bottom: 0;
width: var(--toc-width);
background: white;
padding: 0;
overflow-y: auto;
overflow-x: hidden;
scrollbar-width: thin;
}
.toc-title {
font-weight: bold;
margin-bottom: 5px;
font-size: 0.9em;
color: #555;
position: sticky;
transition: position 1.0s ease-in-out;
top: 0;
z-index: 1;
padding: 20px;
margin: 0;
border-bottom: 1px solid #ddd;
/* Gradient background for the title */
background-color: #f0f0f0;
}
.toc-item {
padding: 3px 8px;
margin: 0;
cursor: pointer;
font-size: 0.85em;
border-radius: 3px;
transition: background 0.2s;
}
.toc-item:hover {
background: #f0f0f0;
}
.toc-item.selected {
background: #e0e0e0;
font-weight: bold;
}
@media (max-width: 1024px) {
.toc-container {
display: none;
}
.page {
margin-left: 0;
}
}
@media (min-width: 1025px) {
.page {
margin-left: calc(var(--toc-width) + 20px);
}
}

7
examples/index.html
View File

@@ -9,18 +9,13 @@
<script type="module" src="index.mjs"></script> <script type="module" src="index.mjs"></script>
</head> </head>
<body> <body>
<div class="toc-container">
<div class="toc-list"></div>
</div>
<script id="example_script"></script> <script id="example_script"></script>
<div class="page"> <div class="page">
<p> <p>
<a href="https://github.com/ArthurSonzogni/FTXUI">FTXUI</a> is a simple <a href="https://github.com/ArthurSonzogni/FTXUI">FTXUI</a> is a simple
functional C++ library for terminal user interface. <br/> functional C++ library for terminal user interface. <br/>
This showcases the: <a This showcases the: <a href="https://github.com/ArthurSonzogni/FTXUI/tree/master/examples">./example/</a> folder. <br/>
href="https://github.com/ArthurSonzogni/FTXUI/tree/master/examples">./example/</a>
folder. See <a id="source">source</a>.
</p> </p>
<div id="terminalContainer"> <div id="terminalContainer">

63
examples/index.mjs
View File

@@ -92,69 +92,6 @@ window.Module = {
}, },
}; };
const source = document.querySelector("#source");
source.href = "https://github.com/ArthurSonzogni/FTXUI/blob/main/examples/" + example + ".cpp";
const words = example.split('/') const words = example.split('/')
words[1] = "ftxui_example_" + words[1] + ".js" words[1] = "ftxui_example_" + words[1] + ".js"
document.querySelector("#example_script").src = words.join('/'); document.querySelector("#example_script").src = words.join('/');
// Table of Contents (TOC) for quick navigation.
// Get select element
const selectEl = document.querySelector('select#selectExample');
if (!selectEl) {
console.error('select#selectExample not found');
} else {
// Get TOC container
const tocContainer = document.querySelector('.toc-container');
const tocList = tocContainer.querySelector('.toc-list');
// Group options by directory
const groupedOptions = Array.from(selectEl.options).reduce((acc, option) => {
const [dir, file] = option.text.split('/');
if (!acc[dir]) {
acc[dir] = [];
}
acc[dir].push({ option, file });
return acc;
}, {});
// Generate TOC items
for (const dir in groupedOptions) {
const dirContainer = document.createElement('div');
const dirHeader = document.createElement('div');
dirHeader.textContent = dir;
dirHeader.className = 'toc-title';
dirContainer.appendChild(dirHeader);
groupedOptions[dir].forEach(({ option, file }) => {
const tocItem = document.createElement('div');
tocItem.textContent = file;
tocItem.className = 'toc-item';
if (selectEl.options[selectEl.selectedIndex].value === option.value) {
tocItem.classList.add('selected');
}
// Click handler
tocItem.addEventListener('click', () => {
for(let i=0; i<selectEl.options.length; ++i) {
if (selectEl.options[i].value == option.value) {
selectEl.selectedIndex = i;
break;
}
}
history.pushState({}, "", "?file=" + option.value);
location.reload();
});
dirContainer.appendChild(tocItem);
});
tocList.appendChild(dirContainer);
}
}''

76
src/ftxui/component/slider.cpp
View File

@@ -33,20 +33,6 @@ Decorator flexDirection(Direction direction) {
return xflex; // NOT_REACHED() return xflex; // NOT_REACHED()
} }
Direction Opposite(Direction d) {
switch (d) {
case Direction::Up:
return Direction::Down;
case Direction::Down:
return Direction::Up;
case Direction::Left:
return Direction::Right;
case Direction::Right:
return Direction::Left;
}
return d; // NOT_REACHED()
}
template <class T> template <class T>
class SliderBase : public SliderOption<T>, public ComponentBase { class SliderBase : public SliderOption<T>, public ComponentBase {
public: public:
@@ -61,15 +47,59 @@ class SliderBase : public SliderOption<T>, public ComponentBase {
flexDirection(this->direction) | reflect(gauge_box_) | gauge_color; flexDirection(this->direction) | reflect(gauge_box_) | gauge_color;
} }
void OnDirection(Direction pressed) { void OnLeft() {
if (pressed == this->direction) { switch (this->direction) {
case Direction::Right:
this->value() -= this->increment();
break;
case Direction::Left:
this->value() += this->increment(); this->value() += this->increment();
return; break;
case Direction::Up:
case Direction::Down:
break;
}
} }
if (pressed == Opposite(this->direction)) { void OnRight() {
switch (this->direction) {
case Direction::Right:
this->value() += this->increment();
break;
case Direction::Left:
this->value() -= this->increment(); this->value() -= this->increment();
return; break;
case Direction::Up:
case Direction::Down:
break;
}
}
void OnUp() {
switch (this->direction) {
case Direction::Up:
this->value() -= this->increment();
break;
case Direction::Down:
this->value() += this->increment();
break;
case Direction::Left:
case Direction::Right:
break;
}
}
void OnDown() {
switch (this->direction) {
case Direction::Down:
this->value() += this->increment();
break;
case Direction::Up:
this->value() -= this->increment();
break;
case Direction::Left:
case Direction::Right:
break;
} }
} }
@@ -80,16 +110,16 @@ class SliderBase : public SliderOption<T>, public ComponentBase {
T old_value = this->value(); T old_value = this->value();
if (event == Event::ArrowLeft || event == Event::Character('h')) { if (event == Event::ArrowLeft || event == Event::Character('h')) {
OnDirection(Direction::Left); OnLeft();
} }
if (event == Event::ArrowRight || event == Event::Character('l')) { if (event == Event::ArrowRight || event == Event::Character('l')) {
OnDirection(Direction::Right); OnRight();
} }
if (event == Event::ArrowUp || event == Event::Character('k')) { if (event == Event::ArrowUp || event == Event::Character('k')) {
OnDirection(Direction::Up); OnDown();
} }
if (event == Event::ArrowDown || event == Event::Character('j')) { if (event == Event::ArrowDown || event == Event::Character('j')) {
OnDirection(Direction::Down); OnUp();
} }
this->value() = std::max(this->min(), std::min(this->max(), this->value())); this->value() = std::max(this->min(), std::min(this->max(), this->value()));