aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--css/style.css100
-rw-r--r--include/ChatWindow.hpp8
-rw-r--r--include/ResponsivePaned.hpp16
-rwxr-xr-xrun.sh4
-rw-r--r--src/ChatMessage.cpp8
-rw-r--r--src/ChatWindow.cpp27
-rw-r--r--src/ResponsivePaned.cpp36
-rw-r--r--src/RoomSettingsWindow.cpp5
-rw-r--r--src/Window.cpp2
-rw-r--r--src/main.cpp33
10 files changed, 184 insertions, 55 deletions
diff --git a/css/style.css b/css/style.css
index 1c34440..64244fa 100644
--- a/css/style.css
+++ b/css/style.css
@@ -1,3 +1,9 @@
+@keyframes ripple_effect {
+ to {
+ background-size: 1000% 1000%;
+ }
+}
+
* {
font-family: Lato;
}
@@ -14,7 +20,7 @@ entry {
caret-color: #f7f7f7;
background-color: #444444;
border-color: #444444;
- border-radius: 10px;
+ border-radius: 4px;
color: #f7f7f7;
box-shadow: none;
}
@@ -44,17 +50,59 @@ scrollbar {
}
button {
- background-image: none;
- background-color: #36393e;
- color: #f7f7f7;
- border-style: none;
- outline-style: none;
+ /*
+ min-height: 24px;
+ min-width: 16px;
+ */
+ /*padding: 6px 10px;*/
+ border: none;
+ font-weight: 500;
+ transition: 100ms, background-size 300ms cubic-bezier(0, 0, 0.2, 1), background-image 1200ms cubic-bezier(0, 0, 0.2, 1);
+ /*box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 0 0 9999px transparent;*/
box-shadow: none;
text-shadow: none;
+ background-color: #36393e;
+ background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
+ background-repeat: no-repeat;
+ background-position: center;
+ background-size: 1000% 1000%;
+ color: rgba(0, 0, 0, 0.62);
+}
+
+button:hover {
+ background-color: #4c5057;
+ /*box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 0 0 9999px transparent;*/
+ color: rgba(0, 0, 0, 0.87);
+}
+
+button:active {
+ transition: 100ms, background-size 0, background-image 0;
+ animation: ripple_effect 225ms cubic-bezier(0, 0, 0.2, 1) forwards;
+ /*box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 0 0 9999px alpha(currentColor, 0.08);*/
+ background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.12) 10%, transparent 0%);
+ background-size: 0% 0%;
+ color: rgba(0, 0, 0, 0.87);
+}
+
+button:disabled {
+ box-shadow: none;
+ background-color: rgba(0, 0, 0, 0.12);
+ color: rgba(0, 0, 0, 0.26);
+}
+
+button:checked {
+ background-color: #4c5057;
+ color: white;
+}
+
+button:checked:disabled {
+ background-color: rgba(66, 133, 244, 0.3);
+ color: rgba(66, 133, 244, 0.5);
}
.confirm-button {
background-color: #3060d8;
+ color: #f7f7f7;
}
menu {
@@ -102,13 +150,15 @@ treeview {
}
.side-panels separator {
- border: 1px solid #2f3136;
- background-color: #2f3136;
+ border: none;
+ background-color: #36393e;
+ box-shadow: 0px 0px 3px #1d1d1d;
}
#top-bar {
background: none;
- box-shadow: 0px 0px 5px #1d1d1d;
+ box-shadow: 0px 0px 3px #1d1d1d;
+ border: none;
}
#top-bar-search {
@@ -141,8 +191,9 @@ treeview {
.left-panel separator {
border: 1px solid #36393e;
- border-top: 3px solid #444444;
+ border-top: 3px dashed #444444;
background-color: #36393e;
+ box-shadow: none;
}
#channels-title {
@@ -151,39 +202,33 @@ treeview {
font-size: 16px;
}
-.room-button {
- background: none;
-}
-
.users-title {
color: #f7f7f7;
font-weight: bold;
font-size: 16px;
}
-#chat-panel {
- background-color: #444444;
-}
-
-#chat-area-layout {
+#message-area-layout {
margin-top: 10px;
margin-bottom: 10px;
}
-.chat-message {
+.message-message {
color: white;
background-color: #36393e;
padding: 15px 15px 15px 15px;
margin: 10px 20px 10px 20px;
- box-shadow: 0px 0px 5px #1d1d1d;
+ box-shadow: 2px 2px 3px #1d1d1d;
+ border: 3px solid transparent;
+ border-radius: 3px;
}
-.chat-message-username {
+.message-message-username {
color: #0fc0fc;
font-size: 14px;
}
-.chat-message-text {
+.message-message-text {
font-size: 13px;
}
@@ -223,6 +268,10 @@ textview text {
}
*/
+#chat-area {
+ border-top: 2px solid #2f3136;
+}
+
#chat-scroll-view {
background-color: #444444;
/*
@@ -232,7 +281,6 @@ textview text {
margin-right: 20px;
*/
padding: 15px;
- box-shadow: 0px 0px 5px #1d1d1d;
}
/*
#chat-input {
@@ -259,4 +307,6 @@ textview text {
.username-list-username {
color: #0fc0fc;
font-weight: bold;
-} \ No newline at end of file
+}
+
+undershoot.top, undershoot.right, undershoot.bottom, undershoot.left { background-size: 0px 0px; } \ No newline at end of file
diff --git a/include/ChatWindow.hpp b/include/ChatWindow.hpp
index 48bbff5..b0f4001 100644
--- a/include/ChatWindow.hpp
+++ b/include/ChatWindow.hpp
@@ -5,10 +5,10 @@
#include "RoomNotificationsWindow.hpp"
#include <dchat/Room.hpp>
#include <gtkmm/label.h>
-#include <gtkmm/togglebutton.h>
+#include <gtkmm/radiobutton.h>
#include <gtkmm/grid.h>
#include <gtkmm/entry.h>
-#include <gtkmm/paned.h>
+#include "ResponsivePaned.hpp"
#include <gtkmm/scrolledwindow.h>
#include <gtkmm/stack.h>
#include <gtkmm/textview.h>
@@ -42,7 +42,7 @@ namespace dchat
Window *window;
private:
void setupTopbar();
- void setupLeftPanel(Gtk::Paned *sidePanels);
+ void setupLeftPanel(Gtk::ResponsivePaned *sidePanels);
void setupMessageArea(Gtk::Grid *rightPanel);
void setupChatInput(Gtk::Grid *rightPanel);
@@ -61,7 +61,7 @@ namespace dchat
{
Gtk::Grid *leftPanelUsersLayout;
Gtk::Grid *messageAreaLayout;
- Gtk::ToggleButton *button;
+ Gtk::RadioButton *button;
};
odhtdb::MapHash<RoomData*> roomDataById;
diff --git a/include/ResponsivePaned.hpp b/include/ResponsivePaned.hpp
new file mode 100644
index 0000000..8f62791
--- /dev/null
+++ b/include/ResponsivePaned.hpp
@@ -0,0 +1,16 @@
+#ifndef RESPONSIVE_PANED_HPP
+#define RESPONSIVE_PANED_HPP
+
+#include <gtkmm/paned.h>
+
+namespace Gtk
+{
+ class ResponsivePaned : public Paned
+ {
+ public:
+ explicit ResponsivePaned(Orientation orientation = ORIENTATION_HORIZONTAL);
+ virtual ~ResponsivePaned() {}
+ };
+}
+
+#endif // RESPONSIVE_PANED_HPP \ No newline at end of file
diff --git a/run.sh b/run.sh
index b78f4e8..39d61ff 100755
--- a/run.sh
+++ b/run.sh
@@ -14,4 +14,6 @@ if [ ! -f ~/.local/share/fonts/Lato-Bold.ttf ]; then
fc-cache
fi
platform=`sibs platform`
-env GTK_THEME="css/style.css" ./sibs-build/$platform/debug/dchat
+set GDK_SYNCHRONIZE
+export LD_PRELOAD=/lib/libSegFault.so
+env GTK_THEME="css/style.css" ./sibs-build/$platform/debug/dchat --g-fatal-warnings
diff --git a/src/ChatMessage.cpp b/src/ChatMessage.cpp
index 98d7f88..aa96abd 100644
--- a/src/ChatMessage.cpp
+++ b/src/ChatMessage.cpp
@@ -10,23 +10,23 @@ namespace dchat
avatar.set_halign(Gtk::ALIGN_START);
avatar.set_valign(Gtk::ALIGN_START);
avatar.set_size_request(50, 50);
- //avatar.url = "https://discordemoji.com/assets/emoji/7752_PepePOOGERSFAST.gif";
+ avatar.url = "https://discordemoji.com/assets/emoji/PoggersHype.gif";
username.set_selectable(true);
username.set_alignment(Gtk::ALIGN_START, Gtk::ALIGN_START);
- username.get_style_context()->add_class("chat-message-username");
+ username.get_style_context()->add_class("message-message-username");
text.set_selectable(true);
text.set_alignment(Gtk::ALIGN_START, Gtk::ALIGN_START);
text.set_line_wrap(true);
text.set_line_wrap_mode(Pango::WRAP_WORD_CHAR);
text.set_vexpand(true);
- text.get_style_context()->add_class("chat-message-text");
+ text.get_style_context()->add_class("message-message-text");
attach(avatar, 0, 0, 1, 2);
attach_next_to(username, avatar, Gtk::POS_RIGHT, 1, 1);
attach_next_to(text, username, Gtk::POS_BOTTOM, 1, 1);
- get_style_context()->add_class("chat-message");
+ get_style_context()->add_class("message-message");
set_column_spacing(10);
set_row_spacing(0);
diff --git a/src/ChatWindow.cpp b/src/ChatWindow.cpp
index 473b5d1..529b857 100644
--- a/src/ChatWindow.cpp
+++ b/src/ChatWindow.cpp
@@ -40,8 +40,9 @@ namespace dchat
stack.add(roomSettingsWindow, "settings");
stack.add(roomNotificationsWindow, "notifications");
- Gtk::Paned *sidePanels = Gtk::manage(new Gtk::Paned(Gtk::ORIENTATION_HORIZONTAL));
+ Gtk::ResponsivePaned *sidePanels = Gtk::manage(new Gtk::ResponsivePaned(Gtk::ORIENTATION_HORIZONTAL));
sidePanels->get_style_context()->add_class("side-panels");
+ sidePanels->set_wide_handle(true);
chatPage.attach(*sidePanels, 0, 1, 1, 2);
setupLeftPanel(sidePanels);
@@ -116,15 +117,15 @@ namespace dchat
});
}
- void ChatWindow::setupLeftPanel(Gtk::Paned *sidePanels)
+ void ChatWindow::setupLeftPanel(Gtk::ResponsivePaned *sidePanels)
{
Gtk::Grid *leftPanelLayout = Gtk::manage(new Gtk::Grid());
leftPanelLayout->set_vexpand(true);
- leftPanelLayout->set_size_request(200);
+ leftPanelLayout->set_size_request(190);
leftPanelLayout->get_style_context()->add_class("left-panel");
sidePanels->add1(*leftPanelLayout);
- Gtk::Paned *leftPanel = Gtk::manage(new Gtk::Paned(Gtk::ORIENTATION_VERTICAL));
+ Gtk::ResponsivePaned *leftPanel = Gtk::manage(new Gtk::ResponsivePaned(Gtk::ORIENTATION_VERTICAL));
leftPanel->set_vexpand(true);
leftPanelLayout->attach(*leftPanel, 0, 0, 1, 2);
@@ -141,11 +142,13 @@ namespace dchat
channelsLayout->attach(*channelsTitle, 0, 0, 1, 1);
Gtk::ScrolledWindow *channelsScrollWindow = Gtk::manage(new Gtk::ScrolledWindow());
+ channelsScrollWindow->set_policy(Gtk::PolicyType::POLICY_NEVER, Gtk::PolicyType::POLICY_NEVER);
channelsScrollWindow->set_vexpand(true);
channelsScrollWindow->set_hexpand(true);
channelsScrollWindow->set_overlay_scrolling(false);
channelsLayout->attach_next_to(*channelsScrollWindow, *channelsTitle, Gtk::POS_BOTTOM, 1, 2);
+ leftPanelChannels.set_row_spacing(5);
leftPanelChannels.set_vexpand(true);
leftPanelChannels.set_hexpand(true);
channelsScrollWindow->add(leftPanelChannels);
@@ -228,14 +231,15 @@ namespace dchat
messageArea.set_policy(Gtk::PolicyType::POLICY_NEVER, Gtk::PolicyType::POLICY_AUTOMATIC);
rightPanel->attach(messageArea, 0, 0, 1, 2);
- messageAreaStack.set_name("chat-area-layout");
+ messageAreaStack.set_name("message-area-layout");
messageArea.add(messageAreaStack);
}
void ChatWindow::setupChatInput(Gtk::Grid *rightPanel)
{
Gtk::Grid *chatArea = Gtk::manage(new Gtk::Grid());
- rightPanel->attach_next_to(*chatArea, messageArea, Gtk::POS_BOTTOM, 1, 1);
+ chatArea->set_name("chat-area");
+ rightPanel->attach(*chatArea, 0, 2, 1, 1);
Gtk::ScrolledWindow *chatScrollWindow = Gtk::manage(new Gtk::ScrolledWindow());
chatScrollWindow->set_hexpand(true);
@@ -353,12 +357,10 @@ namespace dchat
messageAreaStack.add(*messageAreaLayout, roomIdStr);
fprintf(stderr, "Added channel %s\n", room->id->toString().c_str());
- Gtk::ToggleButton *roomButton = new Gtk::ToggleButton("Room name");
- roomButton->set_active(true);
+ Gtk::RadioButton *roomButton = new Gtk::RadioButton("Room name");
+ roomButton->property_draw_indicator().set_value(false);
roomButton->get_style_context()->add_class("room-button");
roomButton->set_hexpand(true);
- roomButton->set_halign(Gtk::ALIGN_START);
- roomButton->get_child()->set_halign(Gtk::ALIGN_START);
roomButton->show();
roomButton->signal_clicked().connect([this, room]
{
@@ -371,6 +373,7 @@ namespace dchat
roomDataById[*room->id] = roomData;
if(!currentRoom)
{
+ roomButton->set_active(true);
currentRoom = room;
currentRoomData = roomData;
if(room->localUser)
@@ -480,8 +483,8 @@ namespace dchat
void ChatWindow::changeRoomName(const RoomChangeNameRequest &request)
{
- Gtk::Button *button = roomDataById[*request.room->id]->button;
- static_cast<Gtk::Label*>(button->get_child())->set_text(request.newName);
+ Gtk::RadioButton *button = roomDataById[*request.room->id]->button;
+ button->set_label(request.newName);
if(*request.room->id == *currentRoom->id)
topbar->setTitle(request.newName);
fprintf(stderr, "Changed room %s name to %s\n", request.room->id->toString().c_str(), request.newName.c_str());
diff --git a/src/ResponsivePaned.cpp b/src/ResponsivePaned.cpp
new file mode 100644
index 0000000..45991bc
--- /dev/null
+++ b/src/ResponsivePaned.cpp
@@ -0,0 +1,36 @@
+#include "../include/ResponsivePaned.hpp"
+
+namespace Gtk
+{
+ ResponsivePaned::ResponsivePaned(Orientation orientation) :
+ Paned(orientation)
+ {
+ /*
+ signal_draw().connect_notify([this](const Cairo::RefPtr<Cairo::Context> &context)
+ {
+ if(get_orientation() == Orientation::ORIENTATION_VERTICAL)
+ return;
+
+ Widget *leftChild = get_child1();
+ if(!leftChild)
+ return;
+
+ int width = get_width();
+ if(width > 720)
+ leftChild->show();
+ else
+ leftChild->hide();
+ });
+
+ signal_configure_event().connect_notify([this](GdkEventConfigure *event)
+ {
+ Widget *leftChild = get_child1();
+ printf("width: %d\n", event->width);
+ if(get_orientation() == Orientation::ORIENTATION_VERTICAL)
+ return;
+
+ return;
+ }, false);
+ */
+ }
+} \ No newline at end of file
diff --git a/src/RoomSettingsWindow.cpp b/src/RoomSettingsWindow.cpp
index e20e36e..8bc9329 100644
--- a/src/RoomSettingsWindow.cpp
+++ b/src/RoomSettingsWindow.cpp
@@ -16,6 +16,7 @@ namespace dchat
sidePanels->get_style_context()->add_class("side-panels");
sidePanels->set_vexpand(true);
sidePanels->set_hexpand(true);
+ sidePanels->set_wide_handle(true);
attach(*sidePanels, 0, 0, 1, 1);
setupLeftPanel(sidePanels);
@@ -35,8 +36,8 @@ namespace dchat
{
Gtk::Grid *leftPanel = Gtk::manage(new Gtk::Grid());
leftPanel->set_vexpand(true);
- leftPanel->set_valign(Gtk::ALIGN_START);
- leftPanel->set_halign(Gtk::ALIGN_START);
+ //leftPanel->set_valign(Gtk::ALIGN_START);
+ //leftPanel->set_halign(Gtk::ALIGN_START);
leftPanel->set_size_request(200);
leftPanel->get_style_context()->add_class("left-panel");
sidePanels->add1(*leftPanel);
diff --git a/src/Window.cpp b/src/Window.cpp
index adad21e..b3c8dcc 100644
--- a/src/Window.cpp
+++ b/src/Window.cpp
@@ -166,7 +166,7 @@ namespace dchat
}
prevTimeMillis = std::chrono::duration_cast<std::chrono::milliseconds>(std::chrono::system_clock::now().time_since_epoch()).count() - 5000;
drawBackgroundConnection = signal_draw().connect(sigc::mem_fun(*this, &Window::drawBackground));
- set_size_request(640, 480);
+ //set_size_request(640, 480);
//set_app_paintable(true);
}
diff --git a/src/main.cpp b/src/main.cpp
index 71e54d3..f6b2ae6 100644
--- a/src/main.cpp
+++ b/src/main.cpp
@@ -2,12 +2,16 @@
#include <gtkmm/application.h>
#include <gtkmm/cssprovider.h>
#include <gtkmm/settings.h>
+#ifndef NDEBUG
+#include <giomm.h>
+#endif
-int main (int argc, char *argv[])
+static int setWindowCss(dchat::Window &window, Glib::RefPtr<Gtk::CssProvider> css)
{
- auto app = Gtk::Application::create(argc, argv, "dec05eba.dchat");
+ auto ctx = window.get_style_context();
+ auto screen = Gdk::Screen::get_default();
+ ctx->remove_provider_for_screen(screen, css);
- auto css = Gtk::CssProvider::create();
try
{
if(!css->load_from_path("css/style.css"))
@@ -22,10 +26,27 @@ int main (int argc, char *argv[])
return 1;
}
- dchat::Window window;
- auto ctx = window.get_style_context();
- auto screen = Gdk::Screen::get_default();
ctx->add_provider_for_screen(screen, css, GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);
+ return 0;
+}
+
+int main (int argc, char *argv[])
+{
+ auto app = Gtk::Application::create(argc, argv, "dec05eba.dchat");
+ auto css = Gtk::CssProvider::create();
+ dchat::Window window;
+ if(setWindowCss(window, css) != 0)
+ return 1;
+
+#ifndef NDEBUG
+ auto cssFile = Gio::File::create_for_path("css/style.css");
+ auto cssFileMonitor = cssFile->monitor_file();
+ cssFileMonitor->signal_changed().connect([&window, css](const Glib::RefPtr<Gio::File> &file, const Glib::RefPtr<Gio::File> &otherFile, Gio::FileMonitorEvent event)
+ {
+ fprintf(stderr, "Css file modified, reloading\n");
+ setWindowCss(window, css);
+ });
+#endif
return app->run(window);
}