From 6a78db07f11e101901333e00cb0bac76a32874ff Mon Sep 17 00:00:00 2001
From: thankyouverycool <66646555+thankyouverycool@users.noreply.github.com>
Date: Tue, 14 Jul 2020 17:18:12 -0400
Subject: [PATCH] LibGUI: Add hover highlighting and keyboard controls to
 ComboBox

Adds a new highlighting effect to the actively selected row in
ComboBox ListView. ComboBoxEditor can now be controlled with
page up, page down, and the up and down arrow keys. ESC and loss
of focus now cause comboboxes to close. Now activates on mouseup
as well as return.
---
 Libraries/LibGUI/AbstractView.cpp | 13 +++++++
 Libraries/LibGUI/AbstractView.h   |  3 ++
 Libraries/LibGUI/ComboBox.cpp     | 53 ++++++++++++++++++++++++---
 Libraries/LibGUI/ListView.cpp     | 61 ++++++++++++++++++++++++++-----
 Libraries/LibGUI/ListView.h       |  6 +++
 Libraries/LibGUI/TextEditor.cpp   | 16 ++++++++
 Libraries/LibGUI/TextEditor.h     |  5 +++
 7 files changed, 142 insertions(+), 15 deletions(-)

diff --git a/Libraries/LibGUI/AbstractView.cpp b/Libraries/LibGUI/AbstractView.cpp
index ab6199d55d1..6635f2d0eaa 100644
--- a/Libraries/LibGUI/AbstractView.cpp
+++ b/Libraries/LibGUI/AbstractView.cpp
@@ -225,6 +225,16 @@ void AbstractView::set_hovered_index(const ModelIndex& index)
     if (m_hovered_index == index)
         return;
     m_hovered_index = index;
+    if (m_hovered_index.is_valid())
+        m_last_valid_hovered_index = m_hovered_index;
+    update();
+}
+
+void AbstractView::set_last_valid_hovered_index(const ModelIndex& index)
+{
+    if (m_last_valid_hovered_index == index)
+        return;
+    m_last_valid_hovered_index = index;
     update();
 }
 
@@ -325,6 +335,9 @@ void AbstractView::mouseup_event(MouseEvent& event)
         m_might_drag = false;
         update();
     }
+
+    if (activates_on_selection())
+        activate_selected();
 }
 
 void AbstractView::doubleclick_event(MouseEvent& event)
diff --git a/Libraries/LibGUI/AbstractView.h b/Libraries/LibGUI/AbstractView.h
index 295efa546e1..7910871952a 100644
--- a/Libraries/LibGUI/AbstractView.h
+++ b/Libraries/LibGUI/AbstractView.h
@@ -74,6 +74,8 @@ public:
 
     NonnullRefPtr<Gfx::Font> font_for_index(const ModelIndex&) const;
 
+    void set_last_valid_hovered_index(const ModelIndex&);
+
 protected:
     AbstractView();
     virtual ~AbstractView() override;
@@ -107,6 +109,7 @@ protected:
     bool m_might_drag { false };
 
     ModelIndex m_hovered_index;
+    ModelIndex m_last_valid_hovered_index;
 
 private:
     RefPtr<Model> m_model;
diff --git a/Libraries/LibGUI/ComboBox.cpp b/Libraries/LibGUI/ComboBox.cpp
index 42a0bdf61ec..ae6a236edbd 100644
--- a/Libraries/LibGUI/ComboBox.cpp
+++ b/Libraries/LibGUI/ComboBox.cpp
@@ -49,6 +49,8 @@ private:
 
     virtual void mousewheel_event(MouseEvent& event) override
     {
+        if (!is_focused())
+            set_focus(true);
         if (on_mousewheel)
             on_mousewheel(event.wheel_delta());
     }
@@ -57,6 +59,7 @@ private:
 ComboBox::ComboBox()
 {
     m_editor = add<ComboBoxEditor>();
+    m_editor->set_has_open_button(true);
     m_editor->on_change = [this] {
         if (on_change)
             on_change(m_editor->text(), m_list_view->selection().first());
@@ -65,6 +68,27 @@ ComboBox::ComboBox()
         if (on_return_pressed)
             on_return_pressed();
     };
+    m_editor->on_up_pressed = [this] {
+        m_list_view->move_selection(-1);
+    };
+    m_editor->on_down_pressed = [this] {
+        m_list_view->move_selection(1);
+    };
+    m_editor->on_pageup_pressed = [this] {
+        m_list_view->move_selection(-m_list_view->selection().first().row());
+    };
+    m_editor->on_pagedown_pressed = [this] {
+        if (model())
+            m_list_view->move_selection((model()->row_count() - 1) - m_list_view->selection().first().row());
+    };
+    m_editor->on_mousewheel = [this](int delta) {
+        m_list_view->move_selection(delta);
+    };
+    m_editor->on_mousedown = [this] {
+        if (only_allow_values_from_model())
+            m_open_button->click();
+    };
+
     m_open_button = add<Button>();
     m_open_button->set_focusable(false);
     m_open_button->set_text("\xE2\xAC\x87"); // DOWNWARDS BLACK ARROW
@@ -77,25 +101,38 @@ ComboBox::ComboBox()
 
     m_list_window = add<Window>();
     m_list_window->set_frameless(true);
+    m_list_window->on_activity_change = [this](const bool is_active) {
+        if (!is_active) {
+            m_open_button->set_enabled(false);
+            close();
+        }
+        m_open_button->set_enabled(true);
+    };
 
     m_list_view = m_list_window->set_main_widget<ListView>();
     m_list_view->horizontal_scrollbar().set_visible(false);
-
+    m_list_view->set_alternating_row_colors(false);
+    m_list_view->set_hover_highlighting(true);
+    m_list_view->set_frame_thickness(1);
+    m_list_view->set_frame_shadow(Gfx::FrameShadow::Plain);
     m_list_view->on_selection = [this](auto& index) {
         ASSERT(model());
+        m_list_view->set_activates_on_selection(true);
         auto new_value = model()->data(index).to_string();
         m_editor->set_text(new_value);
         if (!m_only_allow_values_from_model)
             m_editor->select_all();
-        close();
         deferred_invoke([this, index](auto&) {
             if (on_change)
                 on_change(m_editor->text(), index);
         });
     };
-
-    m_editor->on_mousewheel = [this](int delta) {
-        m_list_view->move_selection(delta);
+    m_list_view->on_activation = [this](auto&) {
+        m_list_view->set_activates_on_selection(false);
+        close();
+    };
+    m_list_view->on_escape_pressed = [this] {
+        close();
     };
 }
 
@@ -152,6 +189,11 @@ void ComboBox::open()
     Gfx::IntRect list_window_rect { my_screen_rect.bottom_left(), size };
     list_window_rect.intersect(Desktop::the().rect().shrunken(0, 128));
 
+    if (m_list_view->hover_highlighting())
+        m_list_view->set_last_valid_hovered_index({});
+
+    m_editor->set_has_visible_list(true);
+    m_editor->set_focus(true);
     m_list_window->set_rect(list_window_rect);
     m_list_window->show();
 }
@@ -159,6 +201,7 @@ void ComboBox::open()
 void ComboBox::close()
 {
     m_list_window->hide();
+    m_editor->set_has_visible_list(false);
     m_editor->set_focus(true);
 }
 
diff --git a/Libraries/LibGUI/ListView.cpp b/Libraries/LibGUI/ListView.cpp
index 8318ec33d52..2b3d1785a22 100644
--- a/Libraries/LibGUI/ListView.cpp
+++ b/Libraries/LibGUI/ListView.cpp
@@ -127,7 +127,12 @@ void ListView::paint_event(PaintEvent& event)
     int painted_item_index = 0;
 
     for (int row_index = 0; row_index < model()->row_count(); ++row_index) {
-        bool is_selected_row = selection().contains_row(row_index);
+        bool is_selected_row;
+        if (hover_highlighting() && m_last_valid_hovered_index.is_valid())
+            is_selected_row = row_index == m_last_valid_hovered_index.row();
+        else
+            is_selected_row = selection().contains_row(row_index);
+
         int y = painted_item_index * item_height();
 
         Color background_color;
@@ -187,15 +192,29 @@ void ListView::move_selection(int steps)
     auto& model = *this->model();
     ModelIndex new_index;
     if (!selection().is_empty()) {
-        auto old_index = selection().first();
-        new_index = model.index(old_index.row() + steps, old_index.column());
+        if (hover_highlighting() && m_last_valid_hovered_index.is_valid()) {
+            new_index = model.index(m_last_valid_hovered_index.row() + steps, m_last_valid_hovered_index.column());
+        } else {
+            auto old_index = selection().first();
+            new_index = model.index(old_index.row() + steps, old_index.column());
+        }
     } else {
-        new_index = model.index(0, 0);
+        if (hover_highlighting() && m_last_valid_hovered_index.is_valid()) {
+            new_index = model.index(m_last_valid_hovered_index.row() + steps, m_last_valid_hovered_index.column());
+        } else {
+            new_index = model.index(0, 0);
+        }
     }
     if (model.is_valid(new_index)) {
+        set_last_valid_hovered_index({});
         selection().set(new_index);
         scroll_into_view(new_index, Orientation::Vertical);
         update();
+    } else {
+        if (hover_highlighting() && m_last_valid_hovered_index.is_valid()) {
+            new_index = model.index(m_last_valid_hovered_index.row(), m_last_valid_hovered_index.column());
+            selection().set(new_index);
+        }
     }
 }
 
@@ -204,7 +223,12 @@ void ListView::keydown_event(KeyEvent& event)
     if (!model())
         return;
     auto& model = *this->model();
+    ModelIndex new_index;
     if (event.key() == KeyCode::Key_Return) {
+        if (hover_highlighting() && m_last_valid_hovered_index.is_valid()) {
+            auto new_index = model.index(m_last_valid_hovered_index.row(), m_last_valid_hovered_index.column());
+            selection().set(new_index);
+        }
         activate_selected();
         return;
     }
@@ -217,9 +241,15 @@ void ListView::keydown_event(KeyEvent& event)
         return;
     }
     if (event.key() == KeyCode::Key_PageUp) {
-        int items_per_page = visible_content_rect().height() / item_height();
-        auto old_index = selection().first();
-        auto new_index = model.index(max(0, old_index.row() - items_per_page), old_index.column());
+        if (hover_highlighting())
+            set_last_valid_hovered_index({});
+        if (!selection().is_empty()) {
+            int items_per_page = visible_content_rect().height() / item_height();
+            auto old_index = selection().first();
+            new_index = model.index(max(0, old_index.row() - items_per_page), old_index.column());
+        } else {
+            new_index = model.index(0, 0);
+        }
         if (model.is_valid(new_index)) {
             selection().set(new_index);
             scroll_into_view(new_index, Orientation::Vertical);
@@ -228,9 +258,15 @@ void ListView::keydown_event(KeyEvent& event)
         return;
     }
     if (event.key() == KeyCode::Key_PageDown) {
-        int items_per_page = visible_content_rect().height() / item_height();
-        auto old_index = selection().first();
-        auto new_index = model.index(min(model.row_count() - 1, old_index.row() + items_per_page), old_index.column());
+        if (hover_highlighting())
+            set_last_valid_hovered_index({});
+        if (!selection().is_empty()) {
+            int items_per_page = visible_content_rect().height() / item_height();
+            auto old_index = selection().first();
+            new_index = model.index(min(model.row_count() - 1, old_index.row() + items_per_page), old_index.column());
+        } else {
+            new_index = model.index(0, 0);
+        }
         if (model.is_valid(new_index)) {
             selection().set(new_index);
             scroll_into_view(new_index, Orientation::Vertical);
@@ -238,6 +274,11 @@ void ListView::keydown_event(KeyEvent& event)
         }
         return;
     }
+    if (event.key() == KeyCode::Key_Escape) {
+        if (on_escape_pressed)
+            on_escape_pressed();
+        return;
+    }
     return Widget::keydown_event(event);
 }
 
diff --git a/Libraries/LibGUI/ListView.h b/Libraries/LibGUI/ListView.h
index 5194d2bd515..ebb2b04f9fe 100644
--- a/Libraries/LibGUI/ListView.h
+++ b/Libraries/LibGUI/ListView.h
@@ -40,6 +40,9 @@ public:
     bool alternating_row_colors() const { return m_alternating_row_colors; }
     void set_alternating_row_colors(bool b) { m_alternating_row_colors = b; }
 
+    bool hover_highlighting() const { return m_hover_highlighting; }
+    void set_hover_highlighting(bool b) { m_hover_highlighting = b; }
+
     int horizontal_padding() const { return m_horizontal_padding; }
 
     void scroll_into_view(const ModelIndex&, Orientation);
@@ -56,6 +59,8 @@ public:
 
     void move_selection(int steps);
 
+    Function<void()> on_escape_pressed;
+
 private:
     ListView();
 
@@ -72,6 +77,7 @@ private:
     int m_horizontal_padding { 2 };
     int m_model_column { 0 };
     bool m_alternating_row_colors { true };
+    bool m_hover_highlighting { false };
 };
 
 }
diff --git a/Libraries/LibGUI/TextEditor.cpp b/Libraries/LibGUI/TextEditor.cpp
index 7533f9a4e1c..d6ae4507d22 100644
--- a/Libraries/LibGUI/TextEditor.cpp
+++ b/Libraries/LibGUI/TextEditor.cpp
@@ -700,6 +700,10 @@ void TextEditor::keydown_event(KeyEvent& event)
             }
         }
         return;
+    } else if (event.key() == KeyCode::Key_Up) {
+        if (on_up_pressed)
+            on_up_pressed();
+        return;
     }
     if (is_multi_line() && event.key() == KeyCode::Key_Down) {
         if (m_cursor.line() < (line_count() - 1)) {
@@ -717,6 +721,10 @@ void TextEditor::keydown_event(KeyEvent& event)
             }
         }
         return;
+    } else if (event.key() == KeyCode::Key_Down) {
+        if (on_down_pressed)
+            on_down_pressed();
+        return;
     }
     if (is_multi_line() && event.key() == KeyCode::Key_PageUp) {
         if (m_cursor.line() > 0) {
@@ -731,6 +739,10 @@ void TextEditor::keydown_event(KeyEvent& event)
             }
         }
         return;
+    } else if (event.key() == KeyCode::Key_PageUp) {
+        if (on_pageup_pressed)
+            on_pageup_pressed();
+        return;
     }
     if (is_multi_line() && event.key() == KeyCode::Key_PageDown) {
         if (m_cursor.line() < (line_count() - 1)) {
@@ -744,6 +756,10 @@ void TextEditor::keydown_event(KeyEvent& event)
             }
         }
         return;
+    } else if (event.key() == KeyCode::Key_PageDown) {
+        if (on_pagedown_pressed)
+            on_pagedown_pressed();
+        return;
     }
     if (event.key() == KeyCode::Key_Left) {
         if (event.ctrl()) {
diff --git a/Libraries/LibGUI/TextEditor.h b/Libraries/LibGUI/TextEditor.h
index a3695090e51..97dc70e02c9 100644
--- a/Libraries/LibGUI/TextEditor.h
+++ b/Libraries/LibGUI/TextEditor.h
@@ -127,8 +127,13 @@ public:
     void redo() { document().redo(); }
 
     Function<void()> on_change;
+    Function<void()> on_mousedown;
     Function<void()> on_return_pressed;
     Function<void()> on_escape_pressed;
+    Function<void()> on_up_pressed;
+    Function<void()> on_down_pressed;
+    Function<void()> on_pageup_pressed;
+    Function<void()> on_pagedown_pressed;
 
     Action& undo_action() { return *m_undo_action; }
     Action& redo_action() { return *m_redo_action; }