Matrix: Add indicator when previous messages are being fetched

2 files changed, 46 insertions, 3 deletions

diff --git a/src/Body.cpp b/src/Body.cpp
index c849aea..b6b1540 100644
--- a/src/Body.cpp
+++ b/src/Body.cpp
@@ -82,7 +82,6 @@ namespace QuickMedia {
         thumbnail_resize_target_size.y = 119;
         thumbnail_fallback_size.x = 50.0f;
         thumbnail_fallback_size.y = 100.0f;
-        image_fallback.setSize(thumbnail_fallback_size);
         image_fallback.setFillColor(sf::Color::White);
         item_background.setFillColor(sf::Color(55, 60, 68));
     }
@@ -374,6 +373,7 @@ namespace QuickMedia {
         //item_background.setFillColor(front_color);
         //item_background.setOutlineThickness(1.0f);
         //item_background.setOutlineColor(sf::Color(13, 15, 17));
+        image_fallback.setSize(thumbnail_fallback_size);
         item_background_shadow.setFillColor(line_seperator_color);
 
         int num_items = items.size();
@@ -553,7 +553,7 @@ namespace QuickMedia {
                 window.draw(image);
                 text_offset_x += image_padding_x + width_ratio * image_size.x;
                 // We want the next image fallback to have the same size as the successful image rendering, because its likely the image fallback will have the same size (for example thumbnails on youtube)
-                image_fallback.setSize(sf::Vector2f(width_ratio * image_size.x, height_ratio * image_size.y));
+                //image_fallback.setSize(sf::Vector2f(width_ratio * image_size.x, height_ratio * image_size.y));
             } else if(!item->thumbnail_url.empty()) {
                 image_fallback.setPosition(item_pos + sf::Vector2f(image_padding_x, padding_y));
                 window.draw(image_fallback);
diff --git a/src/QuickMedia.cpp b/src/QuickMedia.cpp
index 9300059..74ee75e 100644
--- a/src/QuickMedia.cpp
+++ b/src/QuickMedia.cpp
@@ -3182,6 +3182,18 @@ namespace QuickMedia {
         sf::Text text;
     };
 
+    static sf::Color interpolate_colors(sf::Color source, sf::Color target, double progress) {
+        int diff_r = (int)target.r - (int)source.r;
+        int diff_g = (int)target.g - (int)source.g;
+        int diff_b = (int)target.b - (int)source.b;
+        int diff_a = (int)target.a - (int)source.a;
+        return sf::Color(
+            source.r + diff_r * progress,
+            source.g + diff_g * progress,
+            source.b + diff_b * progress,
+            source.a + diff_a * progress);
+    }
+
     void Program::chat_page() {
         assert(current_plugin->name == "matrix");
         Matrix *matrix = static_cast<Matrix*>(current_plugin);
@@ -3349,6 +3361,10 @@ namespace QuickMedia {
         sf::RoundedRectangleShape tab_background(sf::Vector2f(1.0f, 1.0f), 10.0f, 10);
         tab_background.setFillColor(tab_selected_color);
 
+        const float gradient_height = 5.0f;
+        sf::Vertex gradient_points[4];
+        int gradient_inc = 0;
+
         while (current_page == Page::CHAT) {
             while (window.pollEvent(event)) {
                 base_event_handler(event, Page::EXIT, false, false, false);
@@ -3359,6 +3375,7 @@ namespace QuickMedia {
                         bool item_changed = tabs[selected_tab].body->select_previous_item();
                         // Top hit
                         if(!item_changed && !fetching_previous_messages_running) {
+                            gradient_inc = 0;
                             fetching_previous_messages_running = true;
                             previous_messages_future_room_id = current_room_id;
                             previous_messages_future = std::async(std::launch::async, [this, &previous_messages_future_room_id]() {
@@ -3490,9 +3507,22 @@ namespace QuickMedia {
             tabs[selected_tab].body->draw(window, body_pos, body_size);
             const float tab_y = tab_spacer_height + std::floor(tab_vertical_offset + tab_height * 0.5f - (tab_text_size + 5.0f) * 0.5f);
 
-            tab_shade.setSize(sf::Vector2f(window_size.x, tab_spacer_height + std::floor(tab_vertical_offset) + tab_height + 10.0f));
+            const float tab_shade_height = tab_spacer_height + std::floor(tab_vertical_offset) + tab_height + 10.0f;
+            tab_shade.setSize(sf::Vector2f(window_size.x, tab_shade_height));
             window.draw(tab_shade);
 
+            gradient_points[0].position.x = 0.0f;
+            gradient_points[0].position.y = tab_shade_height;
+
+            gradient_points[1].position.x = window_size.x;
+            gradient_points[1].position.y = tab_shade_height;
+
+            gradient_points[2].position.x = window_size.x;
+            gradient_points[2].position.y = tab_shade_height + gradient_height;
+
+            gradient_points[3].position.x = 0.0f;
+            gradient_points[3].position.y = tab_shade_height + gradient_height;
+
             int i = 0;
             for(ChatTab &tab : tabs) {
                 if(i == selected_tab) {
@@ -3505,6 +3535,19 @@ namespace QuickMedia {
                 ++i;
             }
 
+            // TODO: Stop showing this when switching rooms, or have one for each room. Also add bottom one? for fetching new messages
+            if(fetching_previous_messages_running) {
+                double progress = 0.5 + std::sin((double)(gradient_inc % 360) * 0.017453292519943295 - 1.5707963267948966*0.5) * 0.5;
+                gradient_inc += 2;
+                sf::Color top_color = interpolate_colors(back_color, sf::Color(175, 180, 188), progress);
+
+                gradient_points[0].color = top_color;
+                gradient_points[1].color = top_color;
+                gradient_points[2].color = back_color;
+                gradient_points[3].color = back_color;
+                window.draw(gradient_points, 4, sf::Quads); // Note: sf::Quads doesn't work with egl
+            }
+
             window.display();
         }