feat: revealer-based tool menu

icons/hicolor/scalable/actions/vektor-circle-symbolic.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-circle"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0" /></svg>

icons/hicolor/scalable/actions/vektor-circle.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-circle"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0" /></svg>

icons/hicolor/scalable/actions/vektor-line-symbolic.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-line"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M4 18a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" /><path d="M16 6a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" /><path d="M7.5 16.5l9 -9" /></svg>

icons/hicolor/scalable/actions/vektor-rect-symbolic.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-rectangle"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 7a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10" /></svg>

icons/hicolor/scalable/actions/vektor-tool-symbolic.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-hammer"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M11.414 10l-7.383 7.418a2.091 2.091 0 0 0 0 2.967a2.11 2.11 0 0 0 2.976 0l7.407 -7.385" /><path d="M18.121 15.293l2.586 -2.586a1 1 0 0 0 0 -1.414l-7.586 -7.586a1 1 0 0 0 -1.414 0l-2.586 2.586a1 1 0 0 0 0 1.414l7.586 7.586a1 1 0 0 0 1.414 0" /></svg>

src/application/applicationstate.c

@@ -1,10 +1,12 @@
 #include "./applicationstate.h"
 #include "glib.h"
+#include "gtk/gtkrevealer.h"
 #include "src/core/primitives.h"
 #include "src/core/raster.h"
 #include "src/ui/vektorcanvas.h"
 
 typedef struct button_tool_set_data {
+    GtkRevealer* revealer;
     VektorAppState* state;
     VektorAppTool tool;
 } button_tool_set_data;
@@ -13,10 +15,19 @@ static void appstate_set_tool(GtkButton* button, gpointer user_data) {
     button_tool_set_data* data = (button_tool_set_data*)user_data;
     data->state->selectedTool = data->tool;
 
+    // setting tool makes the sub-tools menu to close
+    gtk_revealer_set_reveal_child(data->revealer, FALSE);
+
     // setting tool also resets selected primitive
     data->state->selectedPrimitive = NULL;
 }
 
+static void appstate_reveal_subtools(GtkButton* button, gpointer user_data) {
+    GtkRevealer* revealer = (GtkRevealer*)user_data;
+    gboolean visible = gtk_revealer_get_reveal_child(revealer);
+    gtk_revealer_set_reveal_child(revealer, !visible);
+}
+
 static void canvas_onclick(GtkGestureClick* gesture, int n_press, double x,
                            double y, gpointer user_data) {
 
@@ -76,6 +87,7 @@ void vektor_appstate_new(VektorWidgetState* wstate, VektorAppState* stateOut) {
     button_tool_set_data* data_linetool = malloc(sizeof(button_tool_set_data));
     data_linetool->state = stateOut;
     data_linetool->tool = VektorLineTool;
+    data_linetool->revealer = wstate->workspaceRevealerShapes;
 
     // populate appstate
     stateOut->primitiveBuffer = malloc(sizeof(VektorPrimitiveBuffer));
@@ -88,6 +100,14 @@ void vektor_appstate_new(VektorWidgetState* wstate, VektorAppState* stateOut) {
     // link all the buttons
     g_signal_connect(G_OBJECT(wstate->workspaceButtonLinetool), "clicked",
                      G_CALLBACK(appstate_set_tool), data_linetool);
+    g_signal_connect(G_OBJECT(wstate->workspaceButtonRecttool), "clicked",
+                     G_CALLBACK(appstate_set_tool), data_linetool);
+    g_signal_connect(G_OBJECT(wstate->workspaceButtonCircletool), "clicked",
+                     G_CALLBACK(appstate_set_tool), data_linetool);
+
+    // hook subtool revealers to their master buttons
+    g_signal_connect(G_OBJECT(wstate->workspaceButtonMasterShapes), "clicked",
+                    G_CALLBACK(appstate_reveal_subtools), wstate->workspaceRevealerShapes);
 
     // Add click gesture to canvas
     GtkGesture* canvasClickGesture = gtk_gesture_click_new();

src/ui/uicontroller.c

@@ -3,6 +3,7 @@
 #include "glib-object.h"
 #include "gtk/gtk.h"
 #include "gtk/gtkcssprovider.h"
+#include "gtk/gtkrevealer.h"
 
 void vektor_uictrl_init(GtkApplication* app, VektorWidgetState* stateOut) {
     GtkBuilder* builder = gtk_builder_new();
@@ -20,6 +21,13 @@ void vektor_uictrl_init(GtkApplication* app, VektorWidgetState* stateOut) {
         gdk_display_get_default(), GTK_STYLE_PROVIDER(provider),
         GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);
 
+    // Load theme
+    gtk_icon_theme_add_search_path(
+        gtk_icon_theme_get_for_display(
+            gdk_display_get_default()
+        ), "icons"
+    );
+
     // populate state
     stateOut->window =
         GTK_WINDOW(gtk_builder_get_object(builder, "main_window"));
@@ -27,8 +35,18 @@ void vektor_uictrl_init(GtkApplication* app, VektorWidgetState* stateOut) {
         GTK_PANED(gtk_builder_get_object(builder, "workspace_paned"));
     stateOut->workspaceCanvas =
         GTK_GL_AREA(gtk_builder_get_object(builder, "workspace"));
+
+    stateOut->workspaceButtonMasterShapes =
+        GTK_BUTTON(gtk_builder_get_object(builder, "button_shapetools"));
+    stateOut->workspaceRevealerShapes =
+        GTK_REVEALER(gtk_builder_get_object(builder, "shape_revealer"));
     stateOut->workspaceButtonLinetool =
         GTK_BUTTON(gtk_builder_get_object(builder, "button_linetool"));
+    stateOut->workspaceButtonRecttool =
+        GTK_BUTTON(gtk_builder_get_object(builder, "button_rectangletool"));
+    stateOut->workspaceButtonCircletool =
+        GTK_BUTTON(gtk_builder_get_object(builder, "button_circletool"));
+    
 
     // Set window properties
     gtk_window_set_application(stateOut->window, app);
@@ -44,4 +62,6 @@ void vektor_uictrl_map(VektorWidgetState* state) {
     int window_width = gtk_widget_get_width(GTK_WIDGET(state->window));
     g_print("%i", window_width);
     gtk_paned_set_position(state->workspacePaned, 800 * .7);
+
+    
 }

src/ui/uicontroller.h

@@ -2,6 +2,7 @@
 #define VKTR_UICTRL_H
 
 #include "gtk/gtk.h"
+#include "gtk/gtkrevealer.h"
 
 /*
 Global application widget state, holding references to
@@ -12,7 +13,11 @@ typedef struct VektorWidgetState {
     GtkPaned* workspacePaned;
     GtkGLArea* workspaceCanvas;
 
+    GtkButton* workspaceButtonMasterShapes;
+    GtkRevealer* workspaceRevealerShapes;
     GtkButton* workspaceButtonLinetool;
+    GtkButton* workspaceButtonRecttool;
+    GtkButton* workspaceButtonCircletool;
 
     // GtkWidget* Workspace
 } VektorWidgetState;

ui/main.css

@@ -5,5 +5,5 @@
 }
 
 button {
-    background: none;
+    /*background: none;*/
 }

ui/main.ui

@@ -45,13 +45,6 @@
 
                                 <!--Main canvas-->
                                 <child>
-                                    <!-- <object class="GtkPicture" id="workspace">
-                                        <property name="content-fit">contain</property>
-                                        <property name="hexpand">true</property>
-                                        <property name="vexpand">true</property>
-
-                                    </object> -->
-
                                     <object class="GtkGLArea" id="workspace">
                                         <property name="hexpand">true</property>
                                         <property name="vexpand">true</property>
@@ -71,15 +64,64 @@
                                         <property name="margin-bottom">12</property>
 
                                         <!--Tool buttons-->
+
+                                        <!--Shape tool (row container)-->
                                         <child>
-                                            <object class="GtkButton" id="button_linetool">
+                                            <object class="GtkBox">
-                                                <property name="icon-name">insert-object-symbolic</property>
+                                                <property name="orientation">horizontal</property>
+
+                                                    <!--Shape tool-->
+                                                    <child>
+                                                        <object class="GtkButton" id="button_shapetools">
+                                                            <property name="icon-name">vektor-tool-symbolic</property>
                                                         </object>
                                                     </child>
                                                     
+                                                    <!--Shape subtools revealer-->
                                                     <child>
-                                            <object class="GtkButton">
+                                                        <object class="GtkRevealer" id="shape_revealer">
+                                                            <property name="transition-type">slide-right</property>
+
+                                                            <!--Subtool container-->
+                                                            <child>
+                                                                <object class="GtkBox">
+                                                                    <property name="orientation">horizontal</property>
+
+                                                                    <!--Line tool-->
+                                                                    <child>
+                                                                        <object class="GtkButton" id="button_linetool">
+                                                                            <property name="icon-name">vektor-line-symbolic</property>
+                                                                        </object>
+                                                                    </child>
+
+                                                                    <!--Rectangle tool-->
+                                                                    <child>
+                                                                        <object class="GtkButton" id="button_rectangletool">
+                                                                            <property name="icon-name">vektor-rect-symbolic</property>
+                                                                        </object>
+                                                                    </child>
+
+                                                                    <!--Circle tool-->
+                                                                    <child>
+                                                                        <object class="GtkButton" id="button_circletool">
+                                                                            <property name="icon-name">vektor-circle-symbolic</property>
+                                                                        </object>
+                                                                    </child>
+
+                                                                </object>
+                                                            </child>
+
+                                                        </object>
+                                                    </child>
+
+                                            </object>
+                                        </child>
+
+                                        <!--Copy tool-->
+                                        <child>
+                                            <object class="GtkButton" id="button_copytool">
                                                 <property name="icon-name">edit-copy-symbolic</property>
+                                                <property name="halign">start</property>
                                             </object>
                                         </child>
 
@@ -99,8 +141,32 @@
                     </object>
                 </child>
 
+                <!--Footer-->
+                <child>
+                    <object class="GtkBox" id="footer">
+                        <style><class name="footer"/></style>
+
+                        <property name="orientation">horizontal</property>
+                        <property name="margin-start">6</property>
+                        <property name="margin-end">6</property>
+                        <property name="margin-top">3</property>
+                        <property name="margin-bottom">3</property>
+
+                        <!--Footer status bar-->
+                        <child>
+                            <object class="GtkLabel" id="footer_status">
+                                <property name="label">0 MiB</property>
+                                <property name="xalign">0</property>
                             </object>
                         </child>
 
                     </object>
+                </child>
+
+            </object>
+        </child>
+
+    </object>
+
+
 </interface>