add messages as markup label instead of many labels

src/chat/gui.rs

@@ -33,6 +33,7 @@ use super::{config::{default_max_messages, default_update_time, get_config_path,
 ctx::Context, on_send_message, parse_message, print_message, recv_tick, sanitize_message, SERVER_LIST};
 
 struct UiModel {
+    is_dark_theme: bool,
     chat_box: GtkBox,
     chat_scrolled: ScrolledWindow,
     app: Application,
@@ -394,6 +395,14 @@ fn build_menu(ctx: Arc<Context>, app: &Application) {
 }
 
 fn build_ui(ctx: Arc<Context>, app: &Application) -> UiModel {
+    let is_dark_theme = if let Some(settings) = Settings::default() {
+        settings.is_gtk_application_prefer_dark_theme() || settings.gtk_theme_name()
+            .map(|o| o.to_lowercase().contains("dark"))
+            .unwrap_or_default()
+    } else {
+        false
+    };
+
     let main_box = GtkBox::new(Orientation::Vertical, 5);
 
     main_box.set_css_classes(&["main-box"]);
@@ -629,6 +638,7 @@ fn build_ui(ctx: Arc<Context>, app: &Application) -> UiModel {
     window.present();
 
     UiModel {
+        is_dark_theme,
         chat_scrolled,
         chat_box,
         app: app.clone(),
@@ -703,15 +713,7 @@ fn setup(_: &Application, ctx: Arc<Context>, ui: UiModel) {
     });
 }
 
-fn load_css() {
+fn load_css(is_dark_theme: bool) {
-    let is_dark_theme = if let Some(settings) = Settings::default() {
-        settings.is_gtk_application_prefer_dark_theme() || settings.gtk_theme_name()
-            .map(|o| o.to_lowercase().contains("dark"))
-            .unwrap_or_default()
-    } else {
-        false
-    };
-
     let provider = CssProvider::new();
     provider.load_from_data(&format!(
         "{}\n{}", 
@@ -771,98 +773,73 @@ fn on_add_message(ctx: Arc<Context>, ui: &UiModel, message: String) {
         return;
     }
 
-    let hbox = GtkBox::new(Orientation::Horizontal, 2);
+    // TODO: caching these colors maybe??
+
+    let (ip_color, date_color, text_color) = if ui.is_dark_theme {
+        (
+            "#494949",
+            "#929292",
+            "#FFFFFF"
+        )
+    } else {
+        (
+            "#585858",
+            "#292929",
+            "#000000"
+        )
+    };
+
+    let mut label = String::new();
 
     if let Some((date, ip, content, nick)) = parse_message(message.clone()) {
         if let Some(ip) = ip {
             if ctx.config(|o| o.show_other_ip) {
-                let ip_label = Label::builder()
+                label.push_str(&format!("<span color=\"{ip_color}\">{}</span> ", glib::markup_escape_text(&ip)));
-                    .label(&ip)
-                    .margin_end(10)
-                    .halign(Align::Start)
-                    .valign(Align::Start)
-                    .css_classes(["message-ip"])
-                    .selectable(true)
-                    .build();
-
-                hbox.append(&ip_label);
             }
         }
 
-        let date_label = Label::builder()
+        label.push_str(&format!("<span color=\"{date_color}\">[{}]</span> ", glib::markup_escape_text(&date)));
-            .label(format!("[{date}]"))
-            .halign(Align::Start)
-            .valign(Align::Start)
-            .css_classes(["message-date"])
-            .selectable(true)
-            .build();
-
-        hbox.append(&date_label);
 
         if let Some((name, color)) = nick {
-            let name_label = Label::builder()
+            label.push_str(&format!("<span font_weight=\"bold\" color=\"{}\">&lt;{}&gt;</span> ", color.to_uppercase(), glib::markup_escape_text(&name)));
-                .label(format!("<{name}>"))
-                .halign(Align::Start)
-                .valign(Align::Start)
-                .css_classes(["message-name", &format!("message-name-{}", color)])
-                .selectable(true)
-                .build();
-
-            hbox.append(&name_label);
 
             if !ui.window.is_active() {
                 if ctx.config(|o| o.chunked_enabled) {
-                    send_notification(ctx.clone(), ui, &format!("{}'s Message", &name), &content);
+                    send_notification(ctx.clone(), ui, &format!("{}'s Message", &name), &glib::markup_escape_text(&content));
-                    // let notif = Notification::new(&format!("{}'s Message", &name));
-                    // notif.set_body(Some(&content));
-                    // app.send_notification(Some("user-message"), &notif);
                 }
             }
         } else {
             if !ui.window.is_active() {
                 if ctx.config(|o| o.chunked_enabled) {
                     send_notification(ctx.clone(), ui, "System Message", &content);
-                    // let notif = Notification::new("System Message");
-                    // notif.set_body(Some(&content));
-                    // app.send_notification(Some("system-message"), &notif);
                 }
             }
         }
 
-        let content_label = Label::builder()
+        label.push_str(&format!("<span color=\"{text_color}\">{}</span>", glib::markup_escape_text(&content)));
-            .label(&content)
-            .halign(Align::Start)
-            .valign(Align::Start)
-            .css_classes(["message-content"])
-            .selectable(true)
-            .wrap(true)
-            .wrap_mode(WrapMode::Char)
-            .build();
-
-        hbox.append(&content_label);
-
     } else {
-        let content_label = Label::builder()
+        label.push_str(&format!("<span color=\"{text_color}\">{}</span>", glib::markup_escape_text(&message)));
-            .label(&message)
-            .halign(Align::Start)
-            .valign(Align::Start)
-            .css_classes(["message-content"])
-            .selectable(true)
-            .wrap(true)
-            .wrap_mode(WrapMode::Char)
-            .build();
-
-        hbox.append(&content_label);
 
         if !ui.window.is_active() {
             if ctx.config(|o| o.chunked_enabled) {
                 send_notification(ctx.clone(), ui, "Chat Message", &message);
-                // let notif = Notification::new("Chat Message");
-                // notif.set_body(Some(&message));
-                // app.send_notification(Some("chat-message"), &notif);
             }
         }
     }
+    
+    let hbox = GtkBox::new(Orientation::Horizontal, 2);
+
+    hbox.append(&Label::builder()
+        .label(&label)
+        .halign(Align::Start)
+        .valign(Align::Start)
+        .selectable(true)
+        .wrap(true)
+        .wrap_mode(WrapMode::WordChar)
+        .use_markup(true)
+        .build());
+
+    hbox.set_hexpand(true);
 
     ui.chat_box.append(&hbox);
 
@@ -905,8 +882,8 @@ pub fn run_main_loop(ctx: Arc<Context>) {
 
         move |app| {
             let ui = build_ui(ctx.clone(), app);
+            load_css(ui.is_dark_theme);
             setup(app, ctx.clone(), ui);
-            load_css();
         }
     });
 

src/chat/mod.rs

@@ -31,10 +31,10 @@ lazy_static! {
     pub static ref IP_REGEX: Regex = Regex::new(r"\{(.*?)\} (.*)").unwrap();
 
     pub static ref COLORED_USERNAMES: Vec<(Regex, String)> = vec![
-        (Regex::new(r"\u{B9AC}\u{3E70}<(.*?)> (.*)").unwrap(),         "green".to_string()),     // bRAC
+        (Regex::new(r"\u{B9AC}\u{3E70}<(.*?)> (.*)").unwrap(),         "#70fa7a".to_string()),     // bRAC
-        (Regex::new(r"\u{2550}\u{2550}\u{2550}<(.*?)> (.*)").unwrap(), "red".to_string()),       // CRAB
+        (Regex::new(r"\u{2550}\u{2550}\u{2550}<(.*?)> (.*)").unwrap(), "#fa7070".to_string()),       // CRAB
-        (Regex::new(r"\u{00B0}\u{0298}<(.*?)> (.*)").unwrap(),         "magenta".to_string()),   // Mefidroniy
+        (Regex::new(r"\u{00B0}\u{0298}<(.*?)> (.*)").unwrap(),         "#da70fa".to_string()),   // Mefidroniy
-        (Regex::new(r"<(.*?)> (.*)").unwrap(),                         "cyan".to_string()),      // clRAC
+        (Regex::new(r"<(.*?)> (.*)").unwrap(),                         "#70fadc".to_string()),      // clRAC
     ];
 
     pub static ref SERVER_LIST: Vec<String> = vec![

src/chat/styles/dark.css

@@ -1,3 +1,6 @@
-.message-content { color:rgb(255, 255, 255); }
+
+/* Now made with GTK Pango Markup */
+
+/* .message-content { color:rgb(255, 255, 255); }
 .message-date { color:rgb(146, 146, 146); }
-.message-ip { color:rgb(73, 73, 73); }
+.message-ip { color:rgb(73, 73, 73); } */

src/chat/styles/light.css

@@ -1,3 +1,6 @@
-.message-content { color:rgb(0, 0, 0); }
+
+/* Now made with GTK Pango Markup */
+
+/* .message-content { color:rgb(0, 0, 0); }
 .message-date { color:rgb(41, 41, 41); }
-.message-ip { color:rgb(88, 88, 88); }
+.message-ip { color:rgb(88, 88, 88); } */

src/chat/styles/style.css

@@ -1,5 +1,3 @@
-
-
 .send-button, .send-text { border-radius: 0; }
 .calendar { 
     transform: scale(0.6); 
@@ -16,9 +14,11 @@
     font-weight: bold;
 }
 
-.message-name { font-weight: bold; }
+/* Now made with GTK Pango Markup */
+
+/* .message-name { font-weight: bold; }
 
 .message-name-green { color: #70fa7a; }
 .message-name-red { color: #fa7070; }
 .message-name-magenta { color: #da70fa; }
-.message-name-cyan { color: #70fadc; }
+.message-name-cyan { color: #70fadc; } */