feat: add canvas pan and rotate

Bobbert

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

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" version="1.1">
+ <defs>
+  <style id="current-color-scheme" type="text/css">
+   .ColorScheme-Text { color:#444444; } .ColorScheme-Highlight { color:#4285f4; } .ColorScheme-NeutralText { color:#ff9800; } .ColorScheme-PositiveText { color:#4caf50; } .ColorScheme-NegativeText { color:#f44336; }
+  </style>
+ </defs>
+ <path style="fill:currentColor" class="ColorScheme-Text" d="M 16.98,6.5 5.9551,7.502 5.5,8 v 10 l 0.8203,0.385 5.7481,-4.7912 5.7086,2.8532 0.719,-0.502 -1,-8.9997 z m -0.423,1.043 0.845,7.6 -5.1793,-2.5903 -0.543,0.0625 L 6.5,16.932 V 8.457 Z"/>
+ <path style="fill:currentColor" class="ColorScheme-Text" d="m 14,13 a 2,2 0 0 1 -2,2 2,2 0 0 1 -2,-2 2,2 0 0 1 2,-2 2,2 0 0 1 2,2 z M 8,8 A 2,2 0 0 1 6,10 2,2 0 0 1 4,8 2,2 0 0 1 6,6 2,2 0 0 1 8,8 Z m 0,10 a 2,2 0 0 1 -2,2 2,2 0 0 1 -2,-2 2,2 0 0 1 2,-2 2,2 0 0 1 2,2 z m 12,-2 a 2,2 0 0 1 -2,2 2,2 0 0 1 -2,-2 2,2 0 0 1 2,-2 2,2 0 0 1 2,2 z M 19,7 a 2,2 0 0 1 -2,2 2,2 0 0 1 -2,-2 2,2 0 0 1 2,-2 2,2 0 0 1 2,2 z"/>
+</svg>

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

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 22 22">
+ <defs>
+  <style id="current-color-scheme" type="text/css">
+   .ColorScheme-Text { color:#444444; } .ColorScheme-Highlight { color:#4285f4; } .ColorScheme-NeutralText { color:#ff9800; } .ColorScheme-PositiveText { color:#4caf50; } .ColorScheme-NegativeText { color:#f44336; }
+  </style>
+ </defs>
+ <path style="fill:currentColor" class="ColorScheme-Text" d="M 3.9960938 1 L 4.0117188 12.535156 L 6.3339844 10.255859 L 6.7714844 9.8242188 L 7.0097656 10.404297 L 8.9023438 15 L 10.363281 14.328125 L 8.3808594 9.7792969 L 8.1347656 9.2128906 L 8.7285156 9.15625 L 11.996094 8.8457031 L 3.9960938 1 z" transform="translate(3 3)"/>
+</svg>

shaders/selection.frag.glsl

@@ -0,0 +1,39 @@
+#version 320 es
+precision mediump float;
+
+in vec2 vPos;
+out vec4 FragColor;
+
+uniform float uTime;
+uniform vec4 uColor1;
+uniform vec4 uColor2;
+uniform vec2 uMin;
+uniform vec2 uMax;
+
+void main()
+{
+    float borderWidth = 0.008;
+
+
+    float distX = min(vPos.x - uMin.x, uMax.x - vPos.x);
+    float distY = min(vPos.y - uMin.y, uMax.y - vPos.y);
+    float dist  = min(distX, distY);
+
+    if (dist > borderWidth)
+        discard;
+
+    float dash_length = 0.025;
+    float gap_length  = 0.015;
+    float total       = dash_length + gap_length;
+
+    float speed       = 0.3;
+
+    float distance_along = (vPos.x + vPos.y) * 20.0;
+
+    float t = mod( distance_along * total + uTime * speed, total);
+
+    if (t < dash_length)
+        FragColor = uColor2;
+    else
+        FragColor = uColor1;
+}

shaders/triangle.vert.glsl

@@ -7,9 +7,11 @@ layout (location = 1) in vec4 aColor;
 uniform mat4 uProjection;
 
 out vec4 vColor;
+out vec2 vPos;
 
 void main()
 {
     gl_Position = uProjection * vec4(aPos, 0.0, 1.0);
+    vPos = aPos;
     vColor = aColor;
 }

src/application/applicationstate.c

@@ -1,3 +1,4 @@
+#include "src/core/matrix.h"
 #include "src/ui/uicontroller.h"
 #include "stdlib.h"
 
@@ -22,10 +23,14 @@ static void appstate_set_tool(GtkButton* button, gpointer user_data) {
     data->state->selectedTool = data->tool;
 
     // setting tool makes the sub-tools menu to close
-    gtk_revealer_set_reveal_child(data->revealer, FALSE);
+    // (ADD NEW REVEALERS HERE)
+    gtk_revealer_set_reveal_child(
+        data->state->widgetState->workspaceRevealerShapes, FALSE);
 
     // setting tool also resets selected shape
-    data->state->selectedShape = NULL;
+    // NOTE: isn't needed anymore, as you would
+    // want to be able to select & edit existing shapes
+    // data->state->selectedShape = NULL;
 }
 
 static void appstate_reveal_subtools(GtkButton* button, gpointer user_data) {
@@ -34,7 +39,8 @@ static void appstate_reveal_subtools(GtkButton* button, gpointer user_data) {
     gtk_revealer_set_reveal_child(revealer, !visible);
 }
 
-static void appstate_on_color_change(VektorColorWheel* wheel, gpointer user_data) {
+static void appstate_on_color_change(VektorColorWheel* wheel,
+                                     gpointer user_data) {
     VektorColor c = vektor_color_wheel_get_color(wheel);
     VektorAppState* appstate = (VektorAppState*)user_data;
     appstate->currentColor = c;
@@ -48,24 +54,29 @@ static void appstate_on_color_change(VektorColorWheel* wheel, gpointer user_data
     str_r = g_strdup_printf("%d", c.r);
     str_g = g_strdup_printf("%d", c.g);
     str_b = g_strdup_printf("%d", c.b);
-    gtk_editable_set_text(GTK_EDITABLE(appstate->widgetState->sidepanelEntryR), str_r); 
+    gtk_editable_set_text(GTK_EDITABLE(appstate->widgetState->sidepanelEntryR),
-    gtk_editable_set_text(GTK_EDITABLE(appstate->widgetState->sidepanelEntryG), str_g);
+                          str_r);
-    gtk_editable_set_text(GTK_EDITABLE(appstate->widgetState->sidepanelEntryB), str_b);
+    gtk_editable_set_text(GTK_EDITABLE(appstate->widgetState->sidepanelEntryG),
+                          str_g);
+    gtk_editable_set_text(GTK_EDITABLE(appstate->widgetState->sidepanelEntryB),
+                          str_b);
 
-    gtk_gl_area_queue_render(GTK_GL_AREA(appstate->widgetState->workspaceCanvas));
+    /*gtk_gl_area_queue_render(
+        GTK_GL_AREA(appstate->widgetState->workspaceCanvas));*/
 }
 
 static void appstate_on_entry_update(GtkEntry* entry, gpointer user_data) {
     VektorWidgetState* widgetState = (VektorWidgetState*)user_data;
-    unsigned char r = (unsigned char)atoi(gtk_editable_get_text(GTK_EDITABLE(widgetState->sidepanelEntryR)));
+    unsigned char r = (unsigned char)atoi(
-    unsigned char g = (unsigned char)atoi(gtk_editable_get_text(GTK_EDITABLE(widgetState->sidepanelEntryG)));
+        gtk_editable_get_text(GTK_EDITABLE(widgetState->sidepanelEntryR)));
-    unsigned char b = (unsigned char)atoi(gtk_editable_get_text(GTK_EDITABLE(widgetState->sidepanelEntryB)));
+    unsigned char g = (unsigned char)atoi(
+        gtk_editable_get_text(GTK_EDITABLE(widgetState->sidepanelEntryG)));
+    unsigned char b = (unsigned char)atoi(
+        gtk_editable_get_text(GTK_EDITABLE(widgetState->sidepanelEntryB)));
 
-    g_print("%d", r);
     vektor_color_wheel_set_color(
         VEKTOR_COLOR_WHEEL(widgetState->workspaceColorPicker),
-        (VektorColor){.r = r, .g = g, .b = b}
+        (VektorColor){.r = r, .g = g, .b = b});
-    );
 }
 
 static void canvas_onclick(GtkGestureClick* gesture, int n_press, double x,
@@ -87,11 +98,13 @@ static void canvas_onclick(GtkGestureClick* gesture, int n_press, double x,
 
     vektor_appstate_canvas_click(state, normalized_coords.x,
                                  normalized_coords.y);
-    gtk_gl_area_queue_render(GTK_GL_AREA(widget));
+
+    // gtk_gl_area_queue_render(GTK_GL_AREA(widget));
 }
 
 void vektor_appstate_canvas_click(VektorAppState* state, double x, double y) {
-    V2 pos = (V2){x, y};
+    V2 pos =
+        m33_transform(m33_inverse(state->renderInfo->canvasMat), (V2){x, y});
 
 begin_click_dispatch:
     if (state->selectedTool == VektorLineTool) {
@@ -101,13 +114,11 @@ begin_click_dispatch:
             VektorPolyline* line = vektor_polyline_new();
             VektorPrimitive linePrimitive =
                 (VektorPrimitive){.kind = VEKTOR_POLYLINE, .polyline = line};
-            VektorStyle style =
+            VektorStyle style = (VektorStyle){
-                (VektorStyle){.stroke_color = state->currentColor,
+                .stroke_color = state->currentColor, .stroke_width = 0.01};
-                              .stroke_width = 0.01};
-            VektorShape shape = (VektorShape){
-                .primitive = linePrimitive, .z_index = 0, .style = style};
-            vektor_shapebuffer_add_shape(state->shapeBuffer, vektor_shape_new(linePrimitive, style, 0));
 
+            vektor_shapebuffer_add_shape(
+                state->shapeBuffer, vektor_shape_new(linePrimitive, style, 0));
 
             state->selectedShape =
                 &(state->shapeBuffer->shapes[state->shapeBuffer->count - 1]);
@@ -122,13 +133,64 @@ begin_click_dispatch:
 
         vektor_polyline_add_point(state->selectedShape->primitive.polyline,
                                   pos);
-
         vektor_shapes_update_bbox(state->shapeBuffer);
+    } else if (state->selectedTool == VektorPolygonTool) {
+        // create new polygon shape if none is selected
+        if (state->selectedShape == NULL) {
 
+            VektorPolygon* polygon = vektor_polygon_new();
+            VektorPrimitive polygonPrimitive =
+                (VektorPrimitive){.kind = VEKTOR_POLYGON, .polygon = polygon};
+            VektorStyle style = (VektorStyle){
+                .stroke_color = state->currentColor, .stroke_width = 0.01};
+            vektor_shapebuffer_add_shape(
+                state->shapeBuffer,
+                vektor_shape_new(polygonPrimitive, style, 0));
 
-                    for (size_t i = 0; i < state->shapeBuffer->count; i++) {
+            state->selectedShape =
-                g_print("<%f,%f>-<%f,%f>\n", state->shapeBuffer->shapes[i].bbox.min.x, state->shapeBuffer->shapes[i].bbox.min.y, state->shapeBuffer->shapes[i].bbox.max.x, state->shapeBuffer->shapes[i].bbox.max.y);
+                &(state->shapeBuffer->shapes[state->shapeBuffer->count - 1]);
+
+        } else if (state->selectedShape->primitive.kind != VEKTOR_POLYGON) {
+            g_warning("Invalid selected primitive; polygon expected");
+            state->selectedShape = NULL;
+            goto begin_click_dispatch; // retry
         }
+
+        vektor_polygon_add_point(state->selectedShape->primitive.polygon, pos);
+        vektor_shapes_update_bbox(state->shapeBuffer);
+    } else if (state->selectedTool == VektorRectangleTool) {
+
+        VektorRectangle* rect = vektor_rectangle_new();
+        VektorPrimitive rectPrimitive =
+            (VektorPrimitive){.kind = VEKTOR_RECTANGLE, .rectangle = *rect};
+        VektorStyle style = (VektorStyle){.stroke_color = state->currentColor,
+                                          .stroke_width = 0.01};
+        vektor_shapebuffer_add_shape(state->shapeBuffer,
+                                     vektor_shape_new(rectPrimitive, style, 0));
+
+        state->selectedShape =
+            &(state->shapeBuffer->shapes[state->shapeBuffer->count - 1]);
+
+        vektor_rectangle_free(rect);
+
+        vektor_rectangle_set_start(&state->selectedShape->primitive.rectangle,
+                                   pos);
+        vektor_rectangle_set_end(&state->selectedShape->primitive.rectangle,
+                                 vec2_add(pos, (V2){0.1f, 0.1f}));
+        // state->selectedShape = NULL;
+        vektor_shapes_update_bbox(state->shapeBuffer);
+    } else if (state->selectedTool == VektorSelectionTool) {
+        for (size_t i = 0; i < state->shapeBuffer->count; i++) {
+            VektorBBox bbox = vektor_primitive_get_bbox(
+                state->shapeBuffer->shapes[i].primitive);
+            if (vektor_bbox_isinside(bbox, pos)) {
+                state->selectedShape = &(state->shapeBuffer->shapes[i]);
+                g_print("%d", state->selectedShape == NULL);
+                return;
+            }
+        }
+        // was clicked outside any shapes - reset selection
+        state->selectedShape = NULL;
     }
 }
 
@@ -138,22 +200,62 @@ void vektor_appstate_new(VektorWidgetState* wstate, VektorAppState* stateOut) {
     data_linetool->tool = VektorLineTool;
     data_linetool->revealer = wstate->workspaceRevealerShapes;
 
+    button_tool_set_data* data_polygontool =
+        malloc(sizeof(button_tool_set_data));
+    data_polygontool->state = stateOut;
+    data_polygontool->tool = VektorPolygonTool;
+    data_polygontool->revealer = wstate->workspaceRevealerShapes;
+
+    button_tool_set_data* data_rectangletool =
+        malloc(sizeof(button_tool_set_data));
+    data_rectangletool->state = stateOut;
+    data_rectangletool->tool = VektorRectangleTool;
+    data_rectangletool->revealer = wstate->workspaceRevealerShapes;
+
+    button_tool_set_data* data_selecttool =
+        malloc(sizeof(button_tool_set_data));
+    data_selecttool->state = stateOut;
+    data_selecttool->tool = VektorSelectionTool;
+
     // populate appstate
+    stateOut->startupTime = g_get_monotonic_time();
+
     stateOut->shapeBuffer = malloc(sizeof(VektorShapeBuffer));
     *stateOut->shapeBuffer = (VektorShapeBuffer){0};
+
+    VektorCircle circ = (VektorCircle){.center = (V2){0, 0}, .radius = 0.3};
+    VektorShape shp = vektor_shape_new(
+        (VektorPrimitive){.kind = VEKTOR_CIRCLE, .circle = circ},
+        (VektorStyle){.stroke_color = stateOut->currentColor, 0.01}, 0);
+    vektor_shapebuffer_add_shape(stateOut->shapeBuffer, shp);
+
     stateOut->canvas = malloc(sizeof(VektorCanvas));
     stateOut->widgetState = wstate;
     stateOut->currentColor = vektor_color_solid(0, 0, 0);
     stateOut->selectedShape = NULL;
-    vektor_canvas_init(wstate, stateOut->canvas, stateOut->shapeBuffer);
+    VektorCanvasRenderInfo* renderInfo = malloc(sizeof(VektorCanvasRenderInfo));
-
+    renderInfo->zoom = 1;
+    renderInfo->panX = 0;
+    renderInfo->panY = 0;
+    renderInfo->rotation = 0;
+    m33_to_gl4(m33_identity(), renderInfo->canvasTransform);
+    renderInfo->selectedShape = &(stateOut->selectedShape);
+    renderInfo->shapes = stateOut->shapeBuffer;
+    renderInfo->startupTime = stateOut->startupTime;
+    renderInfo->canvasMat = m33_identity();
+    vektor_canvas_init(wstate, stateOut->canvas, renderInfo);
+    stateOut->renderInfo = renderInfo;
     // link all the buttons
-    g_signal_connect(G_OBJECT(wstate->workspaceButtonLinetool), "clicked",
+    g_signal_connect(G_OBJECT(wstate->workspaceButtonLineTool), "clicked",
                      G_CALLBACK(appstate_set_tool), data_linetool);
-    g_signal_connect(G_OBJECT(wstate->workspaceButtonRecttool), "clicked",
+    g_signal_connect(G_OBJECT(wstate->workspaceButtonRectTool), "clicked",
-                     G_CALLBACK(appstate_set_tool), data_linetool);
+                     G_CALLBACK(appstate_set_tool), data_rectangletool);
-    g_signal_connect(G_OBJECT(wstate->workspaceButtonCircletool), "clicked",
+    g_signal_connect(G_OBJECT(wstate->workspaceButtonCircleTool), "clicked",
                      G_CALLBACK(appstate_set_tool), data_linetool);
+    g_signal_connect(G_OBJECT(wstate->workspaceButtonPolygonTool), "clicked",
+                     G_CALLBACK(appstate_set_tool), data_polygontool);
+    g_signal_connect(G_OBJECT(wstate->workspaceButtonSelectionTool), "clicked",
+                     G_CALLBACK(appstate_set_tool), data_selecttool);
 
     // hook subtool revealers to their master buttons
     g_signal_connect(G_OBJECT(wstate->workspaceButtonMasterShapes), "clicked",
@@ -166,12 +268,14 @@ void vektor_appstate_new(VektorWidgetState* wstate, VektorAppState* stateOut) {
 
     // hook rgb entries change
     g_signal_connect(G_OBJECT(wstate->sidepanelEntryR), "activate",
-                    G_CALLBACK(appstate_on_entry_update), stateOut->widgetState);
+                     G_CALLBACK(appstate_on_entry_update),
+                     stateOut->widgetState);
     g_signal_connect(G_OBJECT(wstate->sidepanelEntryG), "activate",
-                    G_CALLBACK(appstate_on_entry_update), stateOut->widgetState);
+                     G_CALLBACK(appstate_on_entry_update),
+                     stateOut->widgetState);
     g_signal_connect(G_OBJECT(wstate->sidepanelEntryB), "activate",
-                    G_CALLBACK(appstate_on_entry_update), stateOut->widgetState);
+                     G_CALLBACK(appstate_on_entry_update),
-
+                     stateOut->widgetState);
 
     // Add click gesture to canvas
     GtkGesture* canvasClickGesture = gtk_gesture_click_new();

src/application/applicationstate.h

@@ -6,9 +6,16 @@
 #include "../ui/vektorcanvas.h"
 #include "src/core/raster.h"
 
-typedef enum VektorAppTool { VektorLineTool } VektorAppTool;
+typedef enum VektorAppTool {
+    VektorSelectionTool,
+    VektorLineTool,
+    VektorPolygonTool,
+    VektorRectangleTool
+} VektorAppTool;
 
 typedef struct VektorAppState {
+    gint64 startupTime;
+
     VektorWidgetState* widgetState;
 
     VektorAppTool selectedTool;
@@ -20,7 +27,7 @@ typedef struct VektorAppState {
     VektorShapeBuffer* shapeBuffer;
     // View space
     VektorCanvas* canvas;
-
+    VektorCanvasRenderInfo* renderInfo;
 } VektorAppState;
 
 void vektor_appstate_new(VektorWidgetState* wstate, VektorAppState* stateOut);

src/core/matrix.c

@@ -87,3 +87,25 @@ V2 m33_transform(const M33 mat, const V2 v) {
     return (V2){mat.m[0][0] * v.x + mat.m[0][1] * v.y + mat.m[0][2],
                 mat.m[1][0] * v.x + mat.m[1][1] * v.y + mat.m[1][2]};
 }
+
+void m33_to_gl4(const M33 m, float out[16]) {
+    out[0] = m.m[0][0];
+    out[1] = m.m[1][0];
+    out[2] = 0.0f;
+    out[3] = 0.0f;
+
+    out[4] = m.m[0][1];
+    out[5] = m.m[1][1];
+    out[6] = 0.0f;
+    out[7] = 0.0f;
+
+    out[8] = 0.0f;
+    out[9] = 0.0f;
+    out[10] = 1.0f;
+    out[11] = 0.0f;
+
+    out[12] = m.m[0][2];
+    out[13] = m.m[1][2];
+    out[14] = 0.0f;
+    out[15] = 1.0f;
+}

src/core/matrix.h

@@ -22,4 +22,6 @@ M33 m33_inverse(const M33 m);
 
 V2 m33_transform(const M33 mat, const V2 v);
 
+void m33_to_gl4(const M33 m, float out[16]);
+
 #endif // MATRIX_H_

src/core/primitives.c

@@ -17,6 +17,11 @@ void vektor_polyline_add_point(VektorPolyline* pl, V2 point) {
         pl->points = realloc(pl->points, sizeof(V2) * pl->capacity);
     }
     pl->points[pl->count++] = point;
+
+    if (pl->count <= pl->capacity / 4) {
+        pl->capacity /= 2;
+        pl->points = realloc(pl->points, sizeof(V2) * pl->capacity);
+    }
 }
 
 void vektor_polyline_free(VektorPolyline* pl) {
@@ -40,6 +45,11 @@ void vektor_polygon_add_point(VektorPolygon* pg, V2 point) {
         pg->points = realloc(pg->points, sizeof(V2) * pg->capacity);
     }
     pg->points[pg->count++] = point;
+
+    if (pg->count <= pg->capacity / 4) {
+        pg->capacity /= 2;
+        pg->points = realloc(pg->points, sizeof(V2) * pg->capacity);
+    }
 }
 
 void vektor_polygon_free(VektorPolygon* pg) {
@@ -49,6 +59,37 @@ void vektor_polygon_free(VektorPolygon* pg) {
     free(pg);
 }
 
+VektorCircle* vektor_circle_new(void) {
+    VektorCircle* circ = malloc(sizeof(VektorCircle));
+    circ->center = (V2){0, 0};
+    circ->radius = 0;
+    return circ;
+}
+
+void vektor_circle_set_center(VektorCircle* circle, V2 point) {
+    circle->center = point;
+}
+
+void vektor_circle_set_radius(VektorCircle* circle, double radius) {
+    circle->radius = radius;
+}
+
+VektorRectangle* vektor_rectangle_new(void) {
+    VektorRectangle* rct = malloc(sizeof(VektorRectangle));
+    rct->start = (V2){.x = 0, .y = 0};
+    rct->end = (V2){.x = 0, .y = 0};
+    return rct;
+}
+
+void vektor_rectangle_set_end(VektorRectangle* rct, V2 point) {
+    rct->end = point;
+}
+void vektor_rectangle_set_start(VektorRectangle* rct, V2 point) {
+    rct->start = point;
+}
+
+void vektor_rectangle_free(VektorRectangle* rct) { free(rct); }
+
 void vektor_shapebuffer_add_shape(VektorShapeBuffer* buffer,
                                   VektorShape shape) {
     if (buffer->count >= buffer->capacity) {
@@ -57,9 +98,15 @@ void vektor_shapebuffer_add_shape(VektorShapeBuffer* buffer,
             realloc(buffer->shapes, sizeof(VektorShape) * buffer->capacity);
     }
     buffer->shapes[buffer->count++] = shape;
+
+    if (buffer->count <= buffer->capacity / 4) {
+        buffer->capacity /= 2;
+        buffer->shapes =
+            realloc(buffer->shapes, sizeof(VektorShape) * buffer->capacity);
+    }
 }
 
-VektorBBox polyline_mk_bbox(VektorPrimitive prim) {
+VektorBBox vektor_polyline_get_bbox(VektorPrimitive prim) {
     float min_x, max_x, min_y, max_y;
     for (size_t i = 0; i < prim.polyline->count; i++) {
         V2 p = prim.polyline->points[i];
@@ -72,27 +119,43 @@ VektorBBox polyline_mk_bbox(VektorPrimitive prim) {
     return (VektorBBox){(V2){min_x, min_y}, (V2){max_x, max_y}};
 }
 
-VektorBBox polygon_mk_bbox(VektorPrimitive prim) {
+VektorBBox vektor_polygon_get_bbox(VektorPrimitive prim) {
-    float min_x, max_x, min_y, max_y;
+    V2 first = prim.polygon->points[0];
-    for (size_t i = 0; i < prim.polygon->count; i++) {
+
+    float min_x = first.x;
+    float max_x = first.x;
+    float min_y = first.y;
+    float max_y = first.y;
+
+    for (size_t i = 1; i < prim.polygon->count; i++) {
         V2 p = prim.polygon->points[i];
+
         min_x = fminf(min_x, p.x);
         min_y = fminf(min_y, p.y);
 
-        max_x = fminf(max_x, p.x);
+        max_x = fmaxf(max_x, p.x);
-        max_y = fminf(max_y, p.y);
+        max_y = fmaxf(max_y, p.y);
     }
+
     return (VektorBBox){(V2){min_x, min_y}, (V2){max_x, max_y}};
 }
 
-VektorBBox vektor_mk_bbox(VektorPrimitive prim) {
+VektorBBox vektor_rectangle_get_bbox(VektorPrimitive prim) {
+    return (VektorBBox){prim.rectangle.start, prim.rectangle.end};
+}
+
+VektorBBox vektor_primitive_get_bbox(VektorPrimitive prim) {
     switch (prim.kind) {
     case VEKTOR_POLYLINE:
-        return polyline_mk_bbox(prim);
+        return vektor_polyline_get_bbox(prim);
         break;
 
     case VEKTOR_POLYGON:
-        return polygon_mk_bbox(prim);
+        return vektor_polygon_get_bbox(prim);
+        break;
+
+    case VEKTOR_RECTANGLE:
+        return vektor_rectangle_get_bbox(prim);
         break;
 
     default:
@@ -101,13 +164,22 @@ VektorBBox vektor_mk_bbox(VektorPrimitive prim) {
     }
 }
 
+bool vektor_bbox_isinside(VektorBBox bbox, V2 point) {
+    return point.x >= bbox.min.x && point.y >= bbox.min.y &&
+           point.x <= bbox.max.x && point.y <= bbox.max.y;
+}
+
 VektorShape vektor_shape_new(VektorPrimitive prim, VektorStyle style,
                              int z_index) {
-    return (VektorShape){.primitive = prim, .style = style, .z_index = z_index, .bbox=vektor_mk_bbox(prim)};
+    return (VektorShape){.primitive = prim,
+                         .style = style,
+                         .z_index = z_index,
+                         .bbox = vektor_primitive_get_bbox(prim)};
 }
 
 void vektor_shapes_update_bbox(VektorShapeBuffer* buffer) {
     for (size_t i = 0; i < buffer->count; i++) {
-        buffer->shapes[i].bbox = vektor_mk_bbox(buffer->shapes[i].primitive);
+        buffer->shapes[i].bbox =
+            vektor_primitive_get_bbox(buffer->shapes[i].primitive);
     }
 }

src/core/primitives.h

@@ -23,10 +23,16 @@ typedef struct {
     double radius;
 } VektorCircle;
 
+typedef struct {
+    V2 start;
+    V2 end;
+} VektorRectangle;
+
 typedef enum {
     VEKTOR_POLYLINE,
     VEKTOR_POLYGON,
-    VEKTOR_CIRCLE
+    VEKTOR_CIRCLE,
+    VEKTOR_RECTANGLE
 } VektorPrimitiveKind;
 
 typedef struct {
@@ -35,6 +41,7 @@ typedef struct {
         VektorPolyline* polyline;
         VektorPolygon* polygon;
         VektorCircle circle;
+        VektorRectangle rectangle;
     };
 } VektorPrimitive;
 
@@ -46,6 +53,15 @@ VektorPolygon* vektor_polygon_new(void);
 void vektor_polygon_add_point(VektorPolygon* pl, V2 point);
 void vektor_polygon_free(VektorPolygon* pl);
 
+VektorCircle* vektor_circle_new(void);
+void vektor_circle_set_center(VektorCircle* circle, V2 point);
+void vektor_circle_set_radius(VektorCircle* circle, double radius);
+
+VektorRectangle* vektor_rectangle_new(void);
+void vektor_rectangle_set_end(VektorRectangle* rct, V2 point);
+void vektor_rectangle_set_start(VektorRectangle* rct, V2 point);
+void vektor_rectangle_free(VektorRectangle* rct);
+
 typedef struct {
     VektorColor stroke_color;
     float stroke_width;
@@ -63,10 +79,13 @@ typedef struct {
     VektorPrimitive primitive;
 } VektorShape;
 
-VektorBBox polyline_mk_bbox(VektorPrimitive prim);
+VektorBBox vektor_polyline_get_bbox(VektorPrimitive prim);
-VektorBBox polygon_mk_bbox(VektorPrimitive prim);
+VektorBBox vektor_polygon_get_bbox(VektorPrimitive prim);
+VektorBBox vektor_circle_get_bbox(VektorPrimitive prim);
+VektorBBox vektor_rectangle_get_bbox(VektorPrimitive prim);
 
-VektorBBox vektor_mk_bbox(VektorPrimitive prim);
+VektorBBox vektor_primitive_get_bbox(VektorPrimitive prim);
+bool vektor_bbox_isinside(VektorBBox bbox, V2 point);
 
 VektorShape vektor_shape_new(VektorPrimitive prim, VektorStyle style,
                              int z_index);

src/core/raster.c

@@ -1,9 +1,13 @@
 #include "raster.h"
 #include "epoxy/gl.h"
 #include "primitives.h"
+#include "src/core/vector.h"
 #include "stddef.h"
+#include <math.h>
 #include <stddef.h>
 
+#define PI 3.14159265358979323846
+
 void vektor_edgebuffer_add_edge(EdgeBuffer* buffer, Edge edge) {
     if (buffer->count >= buffer->capacity) {
         buffer->capacity = buffer->capacity ? buffer->capacity * 2 : 4;
@@ -12,39 +16,78 @@ void vektor_edgebuffer_add_edge(EdgeBuffer* buffer, Edge edge) {
     buffer->edges[buffer->count++] = edge;
 }
 
-void vektor_polyline_flatten(EdgeBuffer* buffer, VektorPolyline* line,
+void vektor_polyline_tessellate(EdgeBuffer* buffer, VektorPolyline* line,
-                             size_t j) {
+                                size_t j, double scale) {
     for (size_t i = 0; i + 1 < line->count; i++) {
         vektor_edgebuffer_add_edge(
             buffer, (Edge){line->points[i], line->points[i + 1], 0, j});
     }
 }
 
-void vektor_polygon_flatten(EdgeBuffer* buffer, VektorPolygon* pg, size_t j) {
+void vektor_polygon_tessellate(EdgeBuffer* buffer, VektorPolygon* polygon,
-    size_t n = pg->count;
+                               size_t j, double scale) {
-    if (n < 3)
+    for (size_t i = 0; i + 1 < polygon->count; i++) {
+        vektor_edgebuffer_add_edge(
+            buffer, (Edge){polygon->points[i], polygon->points[i + 1], 0, j});
+    }
+    vektor_edgebuffer_add_edge(
+        buffer,
+        (Edge){polygon->points[polygon->count - 1], polygon->points[0], 0, j});
+}
+
+void vektor_circle_tessellate(EdgeBuffer* buffer, VektorCircle* circle,
+                              size_t j, double scale) {
+    double err = 0.000025;
+    size_t res = PI * sqrt((scale * circle->radius) / (2 * err));
+    for (size_t i = 0; i < res; i++) {
+        double theta1 = (2 * PI * i) / res;
+        double theta2 = (2 * PI * (i + 1)) / res;
+        V2 p1 = (V2){circle->center.x + circle->radius * cos(theta1),
+                     circle->center.y + circle->radius * sin(theta1)};
+        V2 p2 = (V2){circle->center.x + circle->radius * cos(theta2),
+                     circle->center.y + circle->radius * sin(theta2)};
+        vektor_edgebuffer_add_edge(buffer, (Edge){p1, p2, 0, j});
+    }
+}
+
+void vektor_rectangle_tessellate(EdgeBuffer* buffer, VektorRectangle* rct,
+                                 size_t j, double scale) {
+    if (vec2_equals(rct->end, rct->start)) {
         return;
-
-    for (size_t i = 0; i < n; i++) {
-        V2 p1 = pg->points[i];
-        V2 p2 = pg->points[(i + 1) % n];
-        int winding = (p1.y < p2.y) ? +1 : -1;
-        vektor_edgebuffer_add_edge(buffer, (Edge){p1, p2, winding, j});
-    }
     }
 
-void vektor_rasterize(VertexBuffer* vb, VektorShapeBuffer* shapes) {
+    Edge top = (Edge){rct->start, (V2){rct->end.x, rct->start.y}, 0, j};
+    Edge right = (Edge){(V2){rct->end.x, rct->start.y}, rct->end, 0, j};
+    Edge bottom = (Edge){(V2){rct->start.x, rct->end.y}, rct->end, 0, j};
+    Edge left = (Edge){rct->start, (V2){rct->start.x, rct->end.y}, 0, j};
+
+    vektor_edgebuffer_add_edge(buffer, top);
+    vektor_edgebuffer_add_edge(buffer, right);
+    vektor_edgebuffer_add_edge(buffer, bottom);
+    vektor_edgebuffer_add_edge(buffer, left);
+}
+
+void vektor_rasterize(VertexBuffer* vb, VektorShapeBuffer* shapes,
+                      double scale) {
     EdgeBuffer edges = {0};
     for (size_t i = 0; i < shapes->count; i++) {
         VektorPrimitive* p = &shapes->shapes[i].primitive;
 
         switch (p->kind) {
         case VEKTOR_POLYLINE:
-            vektor_polyline_flatten(&edges, p->polyline, i);
+            vektor_polyline_tessellate(&edges, p->polyline, i, scale);
             break;
 
         case VEKTOR_POLYGON:
-            vektor_polygon_flatten(&edges, p->polygon, i);
+            vektor_polygon_tessellate(&edges, p->polygon, i, scale);
+            break;
+
+        case VEKTOR_CIRCLE:
+            vektor_circle_tessellate(&edges, &p->circle, i, scale);
+            break;
+
+        case VEKTOR_RECTANGLE:
+            vektor_rectangle_tessellate(&edges, &p->rectangle, i, scale);
             break;
 
         default:
@@ -56,7 +99,8 @@ void vektor_rasterize(VertexBuffer* vb, VektorShapeBuffer* shapes) {
     vektor_edges_to_triangles(vb, &edges, shapes);
 }
 
-void vb_add_triangle(VertexBuffer* vb, V2 v0, V2 v1, V2 v2, VektorColor color) {
+void vektor_vb_add_triangle(VertexBuffer* vb, V2 v0, V2 v1, V2 v2,
+                            VektorColor color) {
     if (vb->count + 3 >= vb->capacity) {
         vb->capacity = vb->capacity ? vb->capacity * 2 : 8;
         vb->vertices = realloc(vb->vertices, sizeof(Vertex) * vb->capacity);
@@ -64,6 +108,27 @@ void vb_add_triangle(VertexBuffer* vb, V2 v0, V2 v1, V2 v2, VektorColor color) {
     vb->vertices[vb->count++] = (Vertex){v0, color};
     vb->vertices[vb->count++] = (Vertex){v1, color};
     vb->vertices[vb->count++] = (Vertex){v2, color};
+
+    if (vb->count <= vb->capacity / 4) {
+        vb->capacity /= 2;
+        vb->vertices = realloc(vb->vertices, sizeof(Vertex) * vb->capacity);
+    }
+}
+
+void vektor_vb_add_quad(VertexBuffer* vb, V2 a, V2 b, VektorColor color) {
+
+    float minx = fminf(a.x, b.x);
+    float maxx = fmaxf(a.x, b.x);
+    float miny = fminf(a.y, b.y);
+    float maxy = fmaxf(a.y, b.y);
+
+    V2 tl = {minx, miny};
+    V2 bl = {minx, maxy};
+    V2 br = {maxx, maxy};
+    V2 tr = {maxx, miny};
+
+    vektor_vb_add_triangle(vb, tl, bl, br, color);
+    vektor_vb_add_triangle(vb, tl, br, tr, color);
 }
 
 void vektor_edge_to_triangles(VertexBuffer* vb, Edge e,
@@ -84,9 +149,9 @@ void vektor_edge_to_triangles(VertexBuffer* vb, Edge e,
     V2 v2 = {e.p2.x + px, e.p2.y + py};
     V2 v3 = {e.p2.x - px, e.p2.y - py};
 
-    vb_add_triangle(vb, v0, v1, v2,
+    vektor_vb_add_triangle(vb, v0, v1, v2,
                            shape_buffer->shapes[e.shape_id].style.stroke_color);
-    vb_add_triangle(vb, v2, v1, v3,
+    vektor_vb_add_triangle(vb, v2, v1, v3,
                            shape_buffer->shapes[e.shape_id].style.stroke_color);
 }
 

src/core/raster.h

@@ -23,8 +23,14 @@ typedef struct {
 
 void vektor_edgebuffer_add_edge(EdgeBuffer* edges, Edge edge);
 
-void vektor_polyline_flatten(EdgeBuffer* edges, VektorPolyline* line, size_t i);
+void vektor_polyline_tessellate(EdgeBuffer* edges, VektorPolyline* line,
-void vektor_polygon_flatten(EdgeBuffer* buffer, VektorPolygon* line, size_t i);
+                                size_t i, double scale);
+void vektor_polygon_tessellate(EdgeBuffer* buffer, VektorPolygon* polygon,
+                               size_t i, double scale);
+void vektor_circle_tessellate(EdgeBuffer* buffer, VektorCircle* circle,
+                              size_t i, double scale);
+void vektor_rectangle_tessellate(EdgeBuffer* buffer, VektorRectangle* rct,
+                                 size_t i, double scale);
 
 typedef struct {
     V2 coords;
@@ -37,11 +43,15 @@ typedef struct {
     size_t capacity;
 } VertexBuffer;
 
-void vb_add_triangle(VertexBuffer* vb, V2 v0, V2 v1, V2 v2, VektorColor color);
+void vektor_vb_add_triangle(VertexBuffer* vb, V2 v0, V2 v1, V2 v2,
+                            VektorColor color);
+void vektor_vb_add_quad(VertexBuffer* vb, V2 v0, V2 v1, VektorColor color);
+
 void vektor_edge_to_triangles(VertexBuffer* vb, Edge e,
                               VektorShapeBuffer* shape_buffer);
 void vektor_edges_to_triangles(VertexBuffer* vb, EdgeBuffer* edges,
                                VektorShapeBuffer* shape_buffer);
-void vektor_rasterize(VertexBuffer* vb, VektorShapeBuffer* shapes);
+void vektor_rasterize(VertexBuffer* vb, VektorShapeBuffer* shapes,
+                      double scale);
 
 #endif // RASTER_H_

src/core/vector.h

@@ -22,6 +22,10 @@ static inline V2 vec2_add(const V2 v1, const V2 v2) {
     return (V2){v1.x + v2.x, v1.y + v2.y};
 }
 
+static inline bool vec2_equals(const V2 v1, const V2 v2) {
+    return (bool)(v1.x == v2.x && v1.y == v2.x);
+}
+
 static inline V2 vec2_sub(const V2 v1, const V2 v2) {
     return (V2){v1.x - v2.x, v1.y - v2.y};
 }

src/main.c

@@ -1,3 +1,4 @@
+#include "glib.h"
 #include "gtk/gtk.h"
 #include "src/application/applicationstate.h"
 #include "src/core/primitives.h"
@@ -14,6 +15,13 @@ static void on_map(GtkWidget* window, gpointer user_data) {
     vektor_uictrl_map((VektorWidgetState*)user_data);
 }
 
+static int update_callback(gpointer data) {
+    VektorAppState* appstate = (VektorAppState*)data;
+    gtk_gl_area_queue_render(
+        GTK_GL_AREA(appstate->widgetState->workspaceCanvas));
+    return G_SOURCE_CONTINUE;
+}
+
 static void activate(GtkApplication* app, gpointer user_data) {
 
     VektorWidgetState* widget_state =
@@ -25,6 +33,8 @@ static void activate(GtkApplication* app, gpointer user_data) {
     g_signal_connect(widget_state->window, "map", G_CALLBACK(on_map),
                      widget_state);
 
+    g_timeout_add(1, update_callback, app_state);
+
     gtk_window_present(widget_state->window);
 }
 

src/ui/uicontroller.c

@@ -50,12 +50,16 @@ void vektor_uictrl_init(GtkApplication* app, VektorWidgetState* stateOut) {
         GTK_BUTTON(gtk_builder_get_object(builder, "button_shapetools"));
     stateOut->workspaceRevealerShapes =
         GTK_REVEALER(gtk_builder_get_object(builder, "shape_revealer"));
-    stateOut->workspaceButtonLinetool =
+    stateOut->workspaceButtonLineTool =
         GTK_BUTTON(gtk_builder_get_object(builder, "button_linetool"));
-    stateOut->workspaceButtonRecttool =
+    stateOut->workspaceButtonRectTool =
         GTK_BUTTON(gtk_builder_get_object(builder, "button_rectangletool"));
-    stateOut->workspaceButtonCircletool =
+    stateOut->workspaceButtonCircleTool =
         GTK_BUTTON(gtk_builder_get_object(builder, "button_circletool"));
+    stateOut->workspaceButtonPolygonTool =
+        GTK_BUTTON(gtk_builder_get_object(builder, "button_polygontool"));
+    stateOut->workspaceButtonSelectionTool =
+        GTK_BUTTON(gtk_builder_get_object(builder, "button_selecttool"));
     stateOut->workspaceColorPicker =
         VEKTOR_COLOR_WHEEL(gtk_builder_get_object(builder, "color_picker"));
 

src/ui/uicontroller.h

@@ -17,9 +17,11 @@ typedef struct VektorWidgetState {
 
     GtkButton* workspaceButtonMasterShapes;
     GtkRevealer* workspaceRevealerShapes;
-    GtkButton* workspaceButtonLinetool;
+    GtkButton* workspaceButtonLineTool;
-    GtkButton* workspaceButtonRecttool;
+    GtkButton* workspaceButtonRectTool;
-    GtkButton* workspaceButtonCircletool;
+    GtkButton* workspaceButtonCircleTool;
+    GtkButton* workspaceButtonPolygonTool;
+    GtkButton* workspaceButtonSelectionTool;
 
     VektorColorWheel* workspaceColorPicker;
 

src/ui/vektorcanvas.c

@@ -1,8 +1,11 @@
 #include "epoxy/gl.h"
+#include "glib.h"
 #include "gtk/gtk.h"
 
 #include "../core/raster.h"
+#include "src/core/matrix.h"
 #include "src/core/primitives.h"
+#include "src/util/color.h"
 #include "uicontroller.h"
 #include "vektorcanvas.h"
 #include <epoxy/gl_generated.h>
@@ -27,7 +30,19 @@ char* read_file(const char* path) {
     return buffer;
 }
 
-static GLuint shader_program;
+static GLuint standard_shader_program;
+static GLuint selection_shader_program;
+
+// shader uniforms
+static GLuint shader_standard_uProjMatrixLoc;
+
+static GLuint shader_selection_uProjMatrixLoc;
+static GLuint shader_selection_uTimeLoc;
+static GLuint shader_selection_uC1Loc;
+static GLuint shader_selection_uC2Loc;
+static GLuint shader_selection_uMinLoc;
+static GLuint shader_selection_uMaxLoc;
+
 static GLuint vao;
 VertexBuffer vb;
 
@@ -46,17 +61,11 @@ static GLuint compile_shader(GLenum type, const char* src) {
     return shader;
 }
 
-static void init_shader(void) {
+static GLuint create_shader_program(char* frag, char* vert) {
-    char* vert_src = read_file("./shaders/triangle.vert.glsl");
+    GLuint vertex = compile_shader(GL_VERTEX_SHADER, vert);
-    char* frag_src = read_file("./shaders/triangle.frag.glsl");
+    GLuint fragment = compile_shader(GL_FRAGMENT_SHADER, frag);
 
-    if (!vert_src || !frag_src)
+    GLuint shader_program = glCreateProgram();
-        g_error("Failed to load shader files");
-
-    GLuint vertex = compile_shader(GL_VERTEX_SHADER, vert_src);
-    GLuint fragment = compile_shader(GL_FRAGMENT_SHADER, frag_src);
-
-    shader_program = glCreateProgram();
     glAttachShader(shader_program, vertex);
     glAttachShader(shader_program, fragment);
     glLinkProgram(shader_program);
@@ -71,6 +80,40 @@ static void init_shader(void) {
 
     glDeleteShader(vertex);
     glDeleteShader(fragment);
+
+    return shader_program;
+}
+
+static void init_shader(void) {
+    char* vert_src = read_file("./shaders/triangle.vert.glsl");
+    char* frag_src = read_file("./shaders/triangle.frag.glsl");
+    char* selection_frag_src = read_file("./shaders/selection.frag.glsl");
+
+    if (!vert_src || !frag_src)
+        g_error("Failed to load shader files");
+
+    standard_shader_program = create_shader_program(frag_src, vert_src);
+    selection_shader_program =
+        create_shader_program(selection_frag_src, vert_src);
+
+    shader_standard_uProjMatrixLoc =
+        glGetUniformLocation(standard_shader_program, "uProjection");
+    shader_selection_uProjMatrixLoc =
+        glGetUniformLocation(selection_shader_program, "uProjection");
+    shader_selection_uTimeLoc =
+        glGetUniformLocation(selection_shader_program, "uTime");
+    shader_selection_uC1Loc =
+        glGetUniformLocation(selection_shader_program, "uColor1");
+    shader_selection_uC2Loc =
+        glGetUniformLocation(selection_shader_program, "uColor2");
+
+    shader_selection_uMinLoc =
+        glGetUniformLocation(selection_shader_program, "uMin");
+    shader_selection_uMaxLoc =
+        glGetUniformLocation(selection_shader_program, "uMax");
+
+    if (shader_selection_uMinLoc == -1 || shader_selection_uMaxLoc == -1)
+        g_warning("Selection shader: uMin/uMax uniform not found in shader!");
 }
 
 static void init_geometry(void) {
@@ -92,30 +135,66 @@ static void init_geometry(void) {
 
     glBindVertexArray(0);
 }
-static gboolean render(GtkGLArea* area, GdkGLContext* context,
+static gboolean render(GtkGLArea* a, GdkGLContext* ctx,
-                       VektorShapeBuffer* prims) {
+                       VektorCanvasRenderInfo* renderInfo) {
-    vektor_rasterize(&vb, prims);
+    vb.count = 0;
+
+    vektor_rasterize(&vb, renderInfo->shapes, 2);
+    size_t shape_vertex_count =
+        vb.count; // remember how many vertices belong to shapes
+
+    // create selection quad if a shape is selected
+    if (renderInfo->selectedShape != NULL &&
+        *(renderInfo->selectedShape) != NULL) {
+        VektorBBox bbox = vektor_primitive_get_bbox(
+            (*(renderInfo->selectedShape))->primitive);
+
+        vektor_vb_add_quad(&vb, bbox.min, bbox.max,
+                           vektor_color_new(255, 255, 255, 255));
+    }
 
     glBufferData(GL_ARRAY_BUFFER, vb.count * sizeof(Vertex), vb.vertices,
                  GL_STATIC_DRAW);
 
-    glUseProgram(shader_program);
+    // PASS 1 - draw shape vertices
+    glUseProgram(standard_shader_program);
 
-    GLuint uProjectionLoc = glGetUniformLocation(shader_program, "uProjection");
+    // float projectionMatrix[16] = {1, 0, 0, 0, 0, 1, 0, 0,
-    float projectionMatrix[16] = {1, 0, 0, 0, 0, 1, 0, 0,
+    //                               0, 0, 1, 0, 0, 0, 0, 1};
-                                  0, 0, 1, 0, 0, 0, 0, 1};
+    glUniformMatrix4fv(shader_standard_uProjMatrixLoc, 1, GL_FALSE,
-    glUniformMatrix4fv(uProjectionLoc, 1, GL_FALSE, projectionMatrix);
+                       renderInfo->canvasTransform);
 
     glBindVertexArray(vao);
     glDisable(GL_CULL_FACE);
-    // glPolygonMode(GL_FRONT_AND_BACK, GL_LINE);
+
     glClearColor(0.1f, 0.1f, 0.1f, 1.0f);
     glClear(GL_COLOR_BUFFER_BIT);
 
-    glDrawArrays(GL_TRIANGLES, 0, vb.count);
+    glDrawArrays(GL_TRIANGLES, 0, shape_vertex_count);
-    GLenum err = glGetError();
+
-    //printf("OpenGL error: %x\n", err);
+    // PASS 2 - draw selection quads
-    // glDrawElements(GL_TRIANGLES, 6, GL_UNSIGNED_INT, 0);
+    if (vb.count > shape_vertex_count) {
+        float time =
+            (g_get_monotonic_time() - renderInfo->startupTime) / 10000000.0f;
+
+        // re-fetch bbox (we know a shape is selected)
+        VektorBBox bbox = vektor_primitive_get_bbox(
+            (*(renderInfo->selectedShape))->primitive);
+
+        glUseProgram(selection_shader_program);
+
+        glUniformMatrix4fv(shader_selection_uProjMatrixLoc, 1, GL_FALSE,
+                           renderInfo->canvasTransform);
+        glUniform1f(shader_selection_uTimeLoc, time);
+        glUniform2f(shader_selection_uMinLoc, bbox.min.x, bbox.min.y);
+        glUniform2f(shader_selection_uMaxLoc, bbox.max.x, bbox.max.y);
+        glUniform4f(shader_selection_uC1Loc, 0, 0, 0, 1);
+        glUniform4f(shader_selection_uC2Loc, 0.46, 0.46, 1, 1);
+
+        glDrawArrays(GL_TRIANGLES, shape_vertex_count,
+                     vb.count - shape_vertex_count);
+    }
+
     glBindVertexArray(0);
     glUseProgram(0);
 
@@ -160,8 +239,109 @@ static void realize(GtkGLArea* area, gpointer user_data) {
     init_geometry();
 }
 
+static void on_scroll(GtkEventControllerScroll* controller, double dx,
+                      double dy, gpointer user_data) {
+    VektorCanvasRenderInfo* s = user_data;
+
+    GdkModifierType state = gtk_event_controller_get_current_event_state(
+        GTK_EVENT_CONTROLLER(controller));
+
+    // if (state & GDK_CONTROL_MASK) {
+
+    if (dy < 0)
+        s->zoom *= 1.1f;
+    else if (dy > 0)
+        s->zoom *= 0.9f;
+
+    M33 mat =
+        m33_mul(m33_translate(s->panX, s->panY),
+                m33_mul(m33_rotate(s->rotation), m33_scale(s->zoom, s->zoom)));
+    // M33 mat = m33_mul(m33_mul(m33_scale(s->zoom, s->zoom),
+    //                           m33_translate(s->panX, s->panY)),
+    //                   m33_rotate(s->rotation));
+    m33_to_gl4(mat, s->canvasTransform);
+    s->canvasMat = mat;
+
+    GtkWidget* widget =
+        gtk_event_controller_get_widget(GTK_EVENT_CONTROLLER(controller));
+    gtk_gl_area_queue_render(GTK_GL_AREA(widget));
+    // }
+}
+
+static void on_pan_begin(GtkGestureDrag* gesture, double start_x,
+                         double start_y, gpointer user_data) {
+    VektorCanvasRenderInfo* s = user_data;
+
+    GdkModifierType state = gtk_event_controller_get_current_event_state(
+        GTK_EVENT_CONTROLLER(gesture));
+
+    if (!(state & GDK_SHIFT_MASK)) {
+        s->drag_start_x = s->panX;
+        s->drag_start_y = s->panY;
+    } else {
+        double x, y;
+        gtk_gesture_drag_get_start_point(gesture, &x, &y);
+
+        s->mouse_start_x = x;
+        s->mouse_start_y = y;
+
+        double cx = VKTR_CANVAS_WIDTH * 0.5;
+        double cy = VKTR_CANVAS_HEIGHT * 0.5;
+
+        double dx = x - cx;
+        double dy = y - cy;
+
+        s->dragStartAngle = atan2(dy, dx);
+        s->dragStartRotation = s->rotation;
+    }
+}
+
+static void on_pan_drag(GtkGestureDrag* gesture, double offset_x,
+                        double offset_y, gpointer user_data) {
+    VektorCanvasRenderInfo* s = user_data;
+
+    GdkModifierType state = gtk_event_controller_get_current_event_state(
+        GTK_EVENT_CONTROLLER(gesture));
+
+    if (!(state & GDK_SHIFT_MASK)) {
+        s->panX = s->drag_start_x + offset_x / (80 * s->zoom);
+        s->panY = s->drag_start_y - offset_y / (80 * s->zoom);
+
+        M33 mat = m33_mul(
+            m33_translate(s->panX, s->panY),
+            m33_mul(m33_rotate(s->rotation), m33_scale(s->zoom, s->zoom)));
+        m33_to_gl4(mat, s->canvasTransform);
+        s->canvasMat = mat;
+    } else {
+        double x, y;
+        gtk_gesture_drag_get_offset(gesture, &x, &y);
+
+        double mx = s->mouse_start_x + x;
+        double my = s->mouse_start_y + y;
+
+        double cx = VKTR_CANVAS_WIDTH * 0.5;
+        double cy = VKTR_CANVAS_HEIGHT * 0.5;
+
+        double dx = mx - cx;
+        double dy = my - cy;
+
+        double angle = -atan2(dy, dx);
+
+        s->rotation = s->dragStartRotation + (angle - s->dragStartAngle);
+
+        M33 mat = m33_mul(
+            m33_translate(s->panX, s->panY),
+            m33_mul(m33_rotate(s->rotation), m33_scale(s->zoom, s->zoom)));
+        m33_to_gl4(mat, s->canvasTransform);
+        s->canvasMat = mat;
+    }
+    GtkWidget* widget =
+        gtk_event_controller_get_widget(GTK_EVENT_CONTROLLER(gesture));
+    gtk_gl_area_queue_render(GTK_GL_AREA(widget));
+}
+
 void vektor_canvas_init(VektorWidgetState* state, VektorCanvas* canvasOut,
-                        VektorShapeBuffer* prims) {
+                        VektorCanvasRenderInfo* renderInfo) {
     canvasOut->canvasWidget = state->workspaceCanvas;
     canvasOut->width = VKTR_CANVAS_WIDTH;
     canvasOut->height = VKTR_CANVAS_HEIGHT;
@@ -176,5 +356,21 @@ void vektor_canvas_init(VektorWidgetState* state, VektorCanvas* canvasOut,
     g_signal_connect(canvasOut->canvasWidget, "realize", G_CALLBACK(realize),
                      NULL);
     g_signal_connect(canvasOut->canvasWidget, "render", G_CALLBACK(render),
-                     prims);
+                     renderInfo);
+
+    GtkEventController* scroll =
+        gtk_event_controller_scroll_new(GTK_EVENT_CONTROLLER_SCROLL_VERTICAL);
+
+    gtk_widget_add_controller(GTK_WIDGET(canvasOut->canvasWidget), scroll);
+
+    g_signal_connect(scroll, "scroll", G_CALLBACK(on_scroll), renderInfo);
+
+    GtkGesture* pan = gtk_gesture_drag_new();
+    gtk_gesture_single_set_button(GTK_GESTURE_SINGLE(pan), GDK_BUTTON_MIDDLE);
+
+    gtk_widget_add_controller(GTK_WIDGET(canvasOut->canvasWidget),
+                              GTK_EVENT_CONTROLLER(pan));
+
+    g_signal_connect(pan, "drag-begin", G_CALLBACK(on_pan_begin), renderInfo);
+    g_signal_connect(pan, "drag-update", G_CALLBACK(on_pan_drag), renderInfo);
 }

src/ui/vektorcanvas.h

@@ -4,6 +4,8 @@
 #include "../core/raster.h"
 #include "../util/color.h"
 #include "gtk/gtk.h"
+#include "src/core/matrix.h"
+#include "src/core/primitives.h"
 #include "uicontroller.h"
 
 typedef struct VektorCanvas {
@@ -18,8 +20,30 @@ typedef struct VektorCanvas {
     int height;
 } VektorCanvas;
 
+typedef struct VektorCanvasRenderInfo {
+    gint64 startupTime;
+    VektorShapeBuffer* shapes;
+
+    // a pointer to appstate->selectedShape
+    VektorShape** selectedShape;
+    float zoom;
+    float panX;
+    float panY;
+    float rotation;
+
+    float dragStartRotation;
+    double dragStartAngle;
+    double drag_start_x;
+    double drag_start_y;
+    double mouse_start_x;
+    double mouse_start_y;
+
+    M33 canvasMat;
+    float canvasTransform[16];
+} VektorCanvasRenderInfo;
+
 void vektor_canvas_init(VektorWidgetState* state, VektorCanvas* canvasOut,
-                        VektorShapeBuffer* shapes);
+                        VektorCanvasRenderInfo* renderInfo);
 // void vektor_canvas_update(VektorCanvas* canvas);
 // void vektor_canvas_fill(VektorCanvas* canvas, VektorColor color);
 // void vektor_canvas_drawfrom(VektorFramebuffer* fb, VektorCanvas* canvas);

src/ui/widgets/colorwheel.c

@@ -21,36 +21,23 @@ struct _VektorColorWheel {
 
 G_DEFINE_TYPE(VektorColorWheel, vektor_color_wheel, GTK_TYPE_DRAWING_AREA)
 
-static gboolean point_in_triangle(
+static gboolean point_in_triangle(double px, double py, double ax, double ay,
-    double px, double py,
+                                  double bx, double by, double cx, double cy,
-    double ax, double ay,
+                                  double* u, double* v, double* w) {
-    double bx, double by,
+    double denom = (by - cy) * (ax - cx) + (cx - bx) * (ay - cy);
-    double cx, double cy,
-    double* u, double* v, double* w)
-{
-    double denom =
-        (by - cy)*(ax - cx) +
-        (cx - bx)*(ay - cy);
 
-    *u =
+    *u = ((by - cy) * (px - cx) + (cx - bx) * (py - cy)) / denom;
-        ((by - cy)*(px - cx) +
-         (cx - bx)*(py - cy)) / denom;
 
-    *v =
+    *v = ((cy - ay) * (px - cx) + (ax - cx) * (py - cy)) / denom;
-        ((cy - ay)*(px - cx) +
-         (ax - cx)*(py - cy)) / denom;
 
     *w = 1 - *u - *v;
 
     return (*u >= 0 && *v >= 0 && *w >= 0);
 }
 
-static void closest_point_on_segment(
+static void closest_point_on_segment(double px, double py, double ax, double ay,
-    double px, double py,
+                                     double bx, double by, double* rx,
-    double ax, double ay,
+                                     double* ry) {
-    double bx, double by,
-    double *rx, double *ry)
-{
     double abx = bx - ax;
     double aby = by - ay;
 
@@ -59,20 +46,19 @@ static void closest_point_on_segment(
 
     double t = (apx * abx + apy * aby) / (abx * abx + aby * aby);
 
-    if (t < 0) t = 0;
+    if (t < 0)
-    if (t > 1) t = 1;
+        t = 0;
+    if (t > 1)
+        t = 1;
 
     *rx = ax + abx * t;
     *ry = ay + aby * t;
 }
 
-static void closest_point_on_triangle(
+static void closest_point_on_triangle(double px, double py, double ax,
-    double px, double py,
+                                      double ay, double bx, double by,
-    double ax, double ay,
+                                      double cx, double cy, double* rx,
-    double bx, double by,
+                                      double* ry) {
-    double cx, double cy,
-    double *rx, double *ry)
-{
     double p1x, p1y;
     double p2x, p2y;
     double p3x, p3y;
@@ -85,12 +71,20 @@ static void closest_point_on_triangle(
     double d2 = (px - p2x) * (px - p2x) + (py - p2y) * (py - p2y);
     double d3 = (px - p3x) * (px - p3x) + (py - p3y) * (py - p3y);
 
-    if (d1 <= d2 && d1 <= d3) { *rx = p1x; *ry = p1y; }
+    if (d1 <= d2 && d1 <= d3) {
-    else if (d2 <= d3) { *rx = p2x; *ry = p2y; }
+        *rx = p1x;
-    else { *rx = p3x; *ry = p3y; }
+        *ry = p1y;
+    } else if (d2 <= d3) {
+        *rx = p2x;
+        *ry = p2y;
+    } else {
+        *rx = p3x;
+        *ry = p3y;
+    }
 }
 
-static void vektor_color_wheel_snapshot(GtkWidget* widget, GtkSnapshot* snapshot) {
+static void vektor_color_wheel_snapshot(GtkWidget* widget,
+                                        GtkSnapshot* snapshot) {
     VektorColorWheel* self = VEKTOR_COLOR_WHEEL(widget);
 
     int width = gtk_widget_get_width(widget);
@@ -153,16 +147,20 @@ static void vektor_color_wheel_snapshot(GtkWidget* widget, GtkSnapshot* snapshot
 
     // White gradient: from pure hue (right) → white (bottom)
     cairo_pattern_t* white = cairo_pattern_create_linear(ax, ay, bx, by);
-    cairo_pattern_add_color_stop_rgba(white, 0.0, 1,1,1, 0.0);     // transparent at pure hue
+    cairo_pattern_add_color_stop_rgba(white, 0.0, 1, 1, 1,
-    cairo_pattern_add_color_stop_rgba(white, 1.0, 1,1,1, 1.0);     // opaque white at bottom
+                                      0.0); // transparent at pure hue
+    cairo_pattern_add_color_stop_rgba(white, 1.0, 1, 1, 1,
+                                      1.0); // opaque white at bottom
     cairo_set_source(cr, white);
     cairo_paint(cr);
     cairo_pattern_destroy(white);
 
     // Black gradient: from pure hue (right) → black (top)
     cairo_pattern_t* black = cairo_pattern_create_linear(ax, ay, cx2, cy2);
-    cairo_pattern_add_color_stop_rgba(black, 0.0, 0,0,0, 0.0);     // transparent at pure hue
+    cairo_pattern_add_color_stop_rgba(black, 0.0, 0, 0, 0,
-    cairo_pattern_add_color_stop_rgba(black, 1.0, 0,0,0, 1.0);     // opaque black at top
+                                      0.0); // transparent at pure hue
+    cairo_pattern_add_color_stop_rgba(black, 1.0, 0, 0, 0,
+                                      1.0); // opaque black at top
     cairo_set_source(cr, black);
     cairo_paint(cr);
     cairo_pattern_destroy(black);
@@ -205,15 +203,10 @@ static void vektor_color_wheel_snapshot(GtkWidget* widget, GtkSnapshot* snapshot
 
     cairo_new_path(cr);
 
-    cairo_arc(cr,
+    cairo_arc(cr, cx, cy, wheel_radius, selector_angle - selector_width,
-            cx, cy,
-            wheel_radius,
-            selector_angle - selector_width,
               selector_angle + selector_width);
 
-    cairo_arc_negative(cr,
+    cairo_arc_negative(cr, cx, cy, inner_radius,
-                    cx, cy,
-                    inner_radius,
                        selector_angle + selector_width,
                        selector_angle - selector_width);
 
@@ -225,7 +218,8 @@ static void vektor_color_wheel_snapshot(GtkWidget* widget, GtkSnapshot* snapshot
     cairo_destroy(cr);
 }
 
-static void on_click(GtkGestureClick* gesture, int n_press, double x, double y, gpointer data) {
+static void on_click(GtkGestureClick* gesture, int n_press, double x, double y,
+                     gpointer data) {
     VektorColorWheel* wheel = VEKTOR_COLOR_WHEEL(data);
     GtkWidget* widget = GTK_WIDGET(wheel);
 
@@ -234,7 +228,6 @@ static void on_click(GtkGestureClick* gesture, int n_press, double x, double y,
 
     double outer_radius = MIN(width, height) / 2.0;
     double wheel_radius = outer_radius * 0.95;
-    double inner_radius = wheel_radius * 0.9;
 
     double triangle_radius = wheel_radius * 0.75;
 
@@ -251,8 +244,21 @@ static void on_click(GtkGestureClick* gesture, int n_press, double x, double y,
     double cy2 = cy - 0.866 * triangle_radius;
 
     double u, v, w;
-    gboolean inside = point_in_triangle(x,y, ax,ay, bx,by, cx2,cy2, &u,&v,&w);
+    gboolean inside =
-    if(inside) { // pick point in the triangle
+        point_in_triangle(x, y, ax, ay, bx, by, cx2, cy2, &u, &v, &w);
+
+    if (wheel->dragging_triangle) {
+
+        if (!inside) { // if outside triangle, snap to its edge
+            double sx, sy;
+
+            closest_point_on_triangle(x, y, ax, ay, bx, by, cx2, cy2, &sx, &sy);
+
+            x = sx;
+            y = sy;
+
+            point_in_triangle(x, y, ax, ay, bx, by, cx2, cy2, &u, &v, &w);
+        }
 
         double denom = u + v;
         if (denom > 0.0001) { // avoid div-by-zero at black vertex
@@ -261,54 +267,25 @@ static void on_click(GtkGestureClick* gesture, int n_press, double x, double y,
             wheel->saturation = 0.0; // arbitrary, since S irrelevant at V=0
         }
         wheel->lightness = denom;
-        g_signal_emit(wheel, signals[COLOR_CHANGED], 0);
 
-    } else {
+    } else { // dragging wheel
         double dx = x - cx;
         double dy = y - cy;
-        double dist = sqrt(dx*dx+dy*dy);
-
-        if(dist > inner_radius && dist < outer_radius) { // pick point on color wheel
 
         double angle = atan2(dy, dx);
-            if(angle < 0) { angle += 2 * M_PI; }
+        if (angle < 0) {
+            angle += 2 * M_PI;
+        }
 
         wheel->hue = angle / (2 * M_PI);
+    }
+
     g_signal_emit(wheel, signals[COLOR_CHANGED], 0);
-            
-        } else if (dist < inner_radius) { // snap to triangle edge
-            double sx,sy;
-
-            closest_point_on_triangle(
-                x,y,
-                ax,ay,
-                bx,by,
-                cx2,cy2,
-                &sx,&sy
-            );
-
-            x = sx;
-            y = sy;
-
-            point_in_triangle(x,y, ax,ay, bx,by, cx2,cy2, &u,&v,&w);
-
-            // calculate triangle point
-            double denom = u + v;
-            if (denom > 0.0001) {
-                wheel->saturation = u / denom;
-            } else {
-                wheel->saturation = 0.0;
-            }
-            wheel->lightness = denom;
-            g_signal_emit(wheel, signals[COLOR_CHANGED], 0);
-        }
-        
-    }
-
     gtk_widget_queue_draw(widget);
 }
 
-static void on_drag(GtkGestureDrag* gesture, double offset_x, double offset_y, gpointer data) {
+static void on_drag(GtkGestureDrag* gesture, double offset_x, double offset_y,
+                    gpointer data) {
     double x, y;
     gtk_gesture_drag_get_start_point(gesture, &x, &y);
 
@@ -318,6 +295,40 @@ static void on_drag(GtkGestureDrag* gesture, double offset_x, double offset_y, g
     on_click(NULL, 0, x, y, data);
 }
 
+static void on_drag_begin(GtkGestureDrag* gesture, gdouble start_x,
+                          gdouble start_y, gpointer user_data) {
+    // set dragging_wheel or dragging_triangle which are used
+    // to determine to where the cursor should snap to
+
+    VektorColorWheel* wheel = VEKTOR_COLOR_WHEEL(user_data);
+    GtkWidget* widget = GTK_WIDGET(wheel);
+
+    int width = gtk_widget_get_width(widget);
+    int height = gtk_widget_get_height(widget);
+
+    double cx = width / 2.0;
+    double cy = height / 2.0;
+
+    double dx = start_x - cx;
+    double dy = start_y - cy;
+    double dist = sqrt(dx * dx + dy * dy);
+
+    double outer_radius = MIN(width, height) / 2.0;
+    double wheel_radius = outer_radius * 0.95;
+    double inner_radius = wheel_radius * 0.9;
+
+    if (dist > inner_radius) {
+        wheel->dragging_wheel = TRUE;
+        wheel->dragging_triangle = FALSE;
+    } else if (dist < inner_radius) {
+        wheel->dragging_wheel = FALSE;
+        wheel->dragging_triangle = TRUE;
+    } else {
+        wheel->dragging_wheel = FALSE;
+        wheel->dragging_triangle = FALSE;
+    }
+}
+
 static void vektor_color_wheel_init(VektorColorWheel* self) {
     GtkGesture* click = gtk_gesture_click_new();
     gtk_widget_add_controller(GTK_WIDGET(self), GTK_EVENT_CONTROLLER(click));
@@ -328,6 +339,7 @@ static void vektor_color_wheel_init(VektorColorWheel* self) {
     gtk_widget_add_controller(GTK_WIDGET(self), GTK_EVENT_CONTROLLER(drag));
 
     g_signal_connect(drag, "drag-update", G_CALLBACK(on_drag), self);
+    g_signal_connect(drag, "drag-begin", G_CALLBACK(on_drag_begin), self);
 }
 
 static void vektor_color_wheel_class_init(VektorColorWheelClass* klass) {
@@ -335,17 +347,8 @@ static void vektor_color_wheel_class_init(VektorColorWheelClass* klass) {
     widget_class->snapshot = vektor_color_wheel_snapshot;
 
     signals[COLOR_CHANGED] =
-    g_signal_new(
+        g_signal_new("color-changed", G_TYPE_FROM_CLASS(klass),
-        "color-changed",
+                     G_SIGNAL_RUN_FIRST, 0, NULL, NULL, NULL, G_TYPE_NONE, 0);
-        G_TYPE_FROM_CLASS(klass),
-        G_SIGNAL_RUN_FIRST,
-        0,
-        NULL,
-        NULL,
-        NULL,
-        G_TYPE_NONE,
-        0
-    );
 }
 
 GtkWidget* vektor_color_wheel_new(void) {
@@ -354,24 +357,17 @@ GtkWidget* vektor_color_wheel_new(void) {
 
 VektorColor vektor_color_wheel_get_color(VektorColorWheel* wheel) {
     float r, g, b;
-    gtk_hsv_to_rgb(wheel->hue,
+    gtk_hsv_to_rgb(wheel->hue, wheel->saturation, wheel->lightness, &r, &g, &b);
-                   wheel->saturation,
-                   wheel->lightness,
-                   &r, &g, &b);
 
-    return (VektorColor) {
+    return (VektorColor){.r = (unsigned char)(r * 255),
-        .r = (unsigned char)(r*255), 
                          .g = (unsigned char)(g * 255),
                          .b = (unsigned char)(b * 255),
-        .a = 255
+                         .a = 255};
-    };
 }
 
-void vektor_color_wheel_get_colorout(VektorColorWheel* wheel, float* r, float* g, float* b) {
+void vektor_color_wheel_get_colorout(VektorColorWheel* wheel, float* r,
-    gtk_hsv_to_rgb(wheel->hue,
+                                     float* g, float* b) {
-                   wheel->saturation,
+    gtk_hsv_to_rgb(wheel->hue, wheel->saturation, wheel->lightness, r, g, b);
-                   wheel->lightness,
-                   r, g, b);
 }
 
 void vektor_color_wheel_set_color(VektorColorWheel* wheel, VektorColor c) {

src/ui/widgets/colorwheel.h

@@ -5,11 +5,13 @@
 #include "src/util/color.h"
 
 #define VEKTOR_TYPE_COLOR_WHEEL vektor_color_wheel_get_type()
-G_DECLARE_FINAL_TYPE(VektorColorWheel, vektor_color_wheel, VEKTOR, COLOR_WHEEL, GtkDrawingArea)
+G_DECLARE_FINAL_TYPE(VektorColorWheel, vektor_color_wheel, VEKTOR, COLOR_WHEEL,
+                     GtkDrawingArea)
 
 GtkWidget* vektor_color_wheel_new(void);
 VektorColor vektor_color_wheel_get_color(VektorColorWheel* wheel);
-void vektor_color_wheel_get_colorout(VektorColorWheel* wheel, float* r, float* g, float* b);
+void vektor_color_wheel_get_colorout(VektorColorWheel* wheel, float* r,
+                                     float* g, float* b);
 void vektor_color_wheel_set_color(VektorColorWheel* wheel, VektorColor c);
 
 #endif

ui/main.ui

@@ -65,6 +65,14 @@
 
                                         <!--Tool buttons-->
 
+                                        <!--Select tool-->
+                                        <child>
+                                            <object class="GtkButton" id="button_selecttool">
+                                                <property name="icon-name">tool-select-symbolic</property>
+                                                <property name="halign">start</property>
+                                            </object>
+                                        </child>
+
                                         <!--Shape tool (row container)-->
                                         <child>
                                             <object class="GtkBox">
@@ -101,6 +109,13 @@
                                                                         </object>
                                                                     </child>
 
+                                                                    <!--Polygon tool-->
+                                                                    <child>
+                                                                        <object class="GtkButton" id="button_polygontool">
+                                                                            <property name="icon-name">tool-polygon-symbolic</property>
+                                                                        </object>
+                                                                    </child>
+
                                                                     <!--Circle tool-->
                                                                     <child>
                                                                         <object class="GtkButton" id="button_circletool">