feat: started defining UI logic

.clangd

@@ -0,0 +1,2 @@
+CompileFlags:
+  Add: [ -Wall, --std=c23, -xc, -Ivendor/ ]

.gitignore

@@ -1,3 +1,5 @@
 bin/
 build/
 Makefile
+.cache/
+compile_commands.json

.gitmodules

@@ -1,3 +1,3 @@
 [submodule "vendor/clay"]
 	path = vendor/clay
-	url = https://github.com/nicbarker/clay.git
+	url = https://git.objectionable.solutions/Sara/clay.git

justfile

@@ -8,3 +8,7 @@ run:
 configure:
 	# CONFIGURING WITH PREMAKE
 	premake5 gmake
+
+clean:
+	rm -r bin/**
+	rm -r build/**

premake5.lua

@@ -8,9 +8,11 @@ project "Dice"
   cdialect "c23"
   location "build/"
   files { "src/**.c" }
-  links { "m", "stdc++" }
+  includedirs { "vendor/" }
+  links { "m", "stdc++", "SDL3", "SDL3_ttf", "SDL3_image" }
   buildoptions { "-Wall" }
   targetdir "bin/"
+  postbuildcommands { "{COPYDIR} %{wks.location}/assets/ %{cfg.targetdir}/assets/" }
   filter "configurations:debug"
     defines { "DEBUG" }
     symbols "On"

src/application.c

@@ -0,0 +1,74 @@
+#include "application.h"
+
+#include "defs.h"
+#include "style.h"
+#include <SDL3/SDL.h>
+
+static inline
+void DiceContainer() {
+	CLAY({ .id = CLAY_ID("DiceContainer"),
+		.layout = {
+			.sizing = { CLAY_SIZING_GROW(0), CLAY_SIZING_PERCENT(0.2) },
+			.padding = CLAY_PADDING_ALL(16),
+		},
+		.backgroundColor = containerColors[0],
+		.cornerRadius = CLAY_CORNER_RADIUS(cornerRadius)
+	}) {
+		CLAY_TEXT(CLAY_STRING("Text data"), CLAY_TEXT_CONFIG({
+			.textColor = textColors[0],
+			.fontId = FONT_DEFAULT,
+			.fontSize = 24,
+		}));
+	}
+}
+
+static inline
+void DiceLogContainer() {
+	CLAY({ .id = CLAY_ID("LogContainer"),
+		.layout = {
+			.sizing = layoutExpand,
+			.padding = CLAY_PADDING_ALL(16),
+		},
+		.backgroundColor = containerColors[0],
+		.cornerRadius = cornerRadiusAll
+	}) {}
+}
+
+static inline
+void InitiativeListContainer() {
+	CLAY({ .id = CLAY_ID("InitiativeListContainer"),
+		.layout = {
+			.sizing = layoutExpand,
+			.padding = CLAY_PADDING_ALL(16),
+		},
+		.backgroundColor = containerColors[0],
+		.cornerRadius = cornerRadiusAll,
+	}) {}
+}
+
+Clay_RenderCommandArray RenderApplication() {
+	Clay_BeginLayout();
+	CLAY({ .id = CLAY_ID("OuterContainer"),
+		.layout = {
+			.layoutDirection = CLAY_TOP_TO_BOTTOM,
+			.sizing = layoutExpand,
+			.padding = CLAY_PADDING_ALL(windowPadding),
+			.childGap = containerGap
+		}
+	}) {
+		DiceContainer();
+		CLAY({ .id = CLAY_ID("LowerSplitContainer"),
+			.layout = {
+				.sizing = layoutExpand,
+				.childGap = containerGap
+			},
+		}) {
+			DiceLogContainer();
+			InitiativeListContainer();
+		}
+	}
+	return Clay_EndLayout();
+}
+
+void HandleEvent(SDL_Event event) {
+}

src/application.h

@@ -0,0 +1,10 @@
+#ifndef APPLICATION_H
+#define APPLICATION_H
+
+#include <clay/clay.h>
+#include <SDL3/SDL_events.h>
+
+extern Clay_RenderCommandArray RenderApplication();
+extern void HandleEvent(SDL_Event evt);
+
+#endif // !APPLICATION_H

src/defs.h

@@ -0,0 +1,19 @@
+#ifndef DEFS_H
+#define DEFS_H
+
+#include <clay/clay.h>
+
+#include <SDL3/SDL.h>
+#include <SDL3_ttf/SDL_ttf.h>
+
+enum Font {
+	FONT_DEFAULT = 0,
+	FONT_MAX
+};
+
+extern SDL_Window *window;
+extern SDL_Renderer *renderer;
+extern TTF_Font *fonts[FONT_MAX];
+extern TTF_TextEngine *textEngine;
+
+#endif // !DEFS_H

src/main.c

@@ -0,0 +1,144 @@
+#include <SDL3/SDL_mouse.h>
+#define CLAY_IMPLEMENTATION
+#include <clay/clay.h>
+#include <clay/renderers/SDL3/clay_renderer_SDL3.c>
+
+#include "application.h"
+#include "defs.h"
+
+#define SDL_MAIN_HANDLED
+#include <SDL3/SDL.h>
+#include <SDL3/SDL_error.h>
+#include <SDL3/SDL_events.h>
+#include <SDL3/SDL_init.h>
+#include <SDL3/SDL_log.h>
+#include <SDL3/SDL_render.h>
+#include <SDL3/SDL_video.h>
+#include <SDL3_ttf/SDL_ttf.h>
+
+#include <stddef.h>
+#include <stdint.h>
+#include <stdbool.h>
+#include <stdlib.h>
+
+SDL_Window *window = nullptr;
+SDL_Renderer *renderer = nullptr;
+int screenWidth = 1920, screenHeight = 1080;
+bool running = true;
+uint64_t clayMemorySize = 0;
+
+Clay_Arena clayPrimaryArena;
+TTF_Font *fonts[FONT_MAX];
+TTF_TextEngine *textEngine = nullptr;
+
+Clay_SDL3RendererData backendData = {
+	.renderer = nullptr,
+	.fonts = nullptr,
+	.textEngine = nullptr
+};
+
+static inline
+Clay_Dimensions MeasureText(Clay_StringSlice text, Clay_TextElementConfig *config, void *userData) {
+	TTF_Font **fonts = userData;
+	TTF_Font *font = fonts[config->fontId];
+	int width, height;
+	TTF_SetFontSize(font, config->fontSize);
+	if (!TTF_GetStringSize(font, text.chars, text.length, &width, &height)) {
+		SDL_LogError(SDL_LOG_CATEGORY_ERROR, "MeasureText failed to measure text %s", SDL_GetError());
+	}
+	return (Clay_Dimensions) {
+		.width = text.length * config->fontSize,
+		.height = config->fontSize
+	};
+}
+
+static
+void HandleClayErrors(Clay_ErrorData data) {
+	SDL_LogError(SDL_LOG_CATEGORY_ERROR, "%s", data.errorText.chars);
+}
+
+static inline
+void InitSDL() {
+	if (!SDL_Init(SDL_INIT_VIDEO | SDL_INIT_EVENTS)) {
+		SDL_LogError(SDL_LOG_CATEGORY_ERROR, "SDL_Init failed: %s", SDL_GetError());
+		exit(1);
+	}
+	if ((window = SDL_CreateWindow("Window", screenWidth, screenHeight, SDL_WINDOW_RESIZABLE)) == nullptr) {
+		SDL_LogError(SDL_LOG_CATEGORY_ERROR, "SDL_CreateWindow failed: %s", SDL_GetError());
+		exit(2);
+	}
+	if((renderer = SDL_CreateRenderer(window, NULL)) == nullptr) {
+		SDL_LogError(SDL_LOG_CATEGORY_ERROR, "SDL_CreateRenderer failed: %s", SDL_GetError());
+		exit(3);
+	}
+	if (!TTF_Init()) {
+		SDL_LogError(SDL_LOG_CATEGORY_ERROR, "TTF_Init failed: %s", SDL_GetError());
+		exit(4);
+	}
+	if((textEngine = TTF_CreateRendererTextEngine(renderer)) == nullptr) {
+		SDL_LogError(SDL_LOG_CATEGORY_ERROR, "TTF_CreateRendererTextEngine failed: %s", SDL_GetError());
+		exit(5);
+	}
+	fonts[FONT_DEFAULT] = TTF_OpenFont("assets/AdwaitaSans-Regular.ttf", 24.f);
+	if (fonts[FONT_DEFAULT] == nullptr) {
+		SDL_LogError(SDL_LOG_CATEGORY_ERROR, "TTF_OpenFont failed: Failed to load adwaita sans: %s", SDL_GetError());
+	}
+}
+
+static
+void InitClay() {
+	clayMemorySize = Clay_MinMemorySize();
+	clayPrimaryArena = Clay_CreateArenaWithCapacityAndMemory(clayMemorySize, SDL_malloc(clayMemorySize));
+	Clay_Initialize(clayPrimaryArena, (Clay_Dimensions) { screenWidth, screenHeight }, (Clay_ErrorHandler) { HandleClayErrors });
+	Clay_SetMeasureTextFunction(MeasureText, fonts);
+	Clay_SetLayoutDimensions((Clay_Dimensions) { screenWidth, screenHeight });
+}
+
+extern Clay_RenderCommandArray RenderApplication();
+extern void HandleEvent(SDL_Event event);
+
+int main(int argc, char *argv[]) {
+	InitSDL();
+	InitClay();
+	backendData = (Clay_SDL3RendererData) {
+		.renderer = renderer,
+		.fonts = fonts,
+		.textEngine = textEngine,
+	};
+	SDL_Event event;
+	while (running) {
+		while (SDL_PollEvent(&event)) {
+			HandleEvent(event);
+			switch (event.type) {
+				case SDL_EVENT_QUIT:
+					running = false;
+					break;
+				case SDL_EVENT_WINDOW_RESIZED:
+					Clay_SetLayoutDimensions((Clay_Dimensions){
+						event.window.data1,
+						event.window.data2
+					});
+					break;
+				case SDL_EVENT_MOUSE_WHEEL:
+					Clay_UpdateScrollContainers(true, (Clay_Vector2){ event.wheel.x, event.wheel.y }, 0.01f);
+					break;
+				case SDL_EVENT_MOUSE_MOTION:
+					Clay_SetPointerState((Clay_Vector2) { event.motion.x, event.motion.y }, event.motion.state & SDL_BUTTON_LEFT);
+					break;
+				case SDL_EVENT_MOUSE_BUTTON_DOWN:
+					Clay_SetPointerState((Clay_Vector2) { event.button.x, event.button.y }, event.button.button == SDL_BUTTON_LEFT);
+				default:
+					break;
+			}
+		}
+		SDL_SetRenderDrawColor(renderer, 10, 10, 10, 255);
+		SDL_RenderClear(renderer);
+		Clay_RenderCommandArray array = RenderApplication();
+		SDL_Clay_RenderClayCommands(&backendData, &array);
+		SDL_RenderPresent(renderer);
+	}
+	SDL_DestroyRenderer(renderer);
+	SDL_DestroyWindow(window);
+	SDL_Quit();
+	return 0;
+}

src/style.c

@@ -0,0 +1 @@
+

src/style.h

@@ -0,0 +1,31 @@
+#ifndef STYLE_H
+#define STYLE_H
+
+#include <clay/clay.h>
+
+constexpr float cornerRadius = 3.f;
+constexpr Clay_CornerRadius cornerRadiusAll = CLAY_CORNER_RADIUS(cornerRadius);
+constexpr float containerGap = 3.f;
+constexpr float windowPadding = 0.f;
+
+constexpr Clay_Color windowBackground = {
+	210, 210, 210, 255
+};
+constexpr Clay_Color containerColors[] = {
+	{ 200, 200, 200, 255 },
+	{ 170, 170, 170, 255 },
+	{ 140, 140, 140, 255 },
+};
+
+constexpr Clay_Color textColors[] = {
+	{ 0, 0, 0, 255 },
+	{ 15, 15, 15, 255 },
+	{ 30, 30, 30, 255 },
+};
+
+constexpr Clay_Sizing layoutExpand = {
+	.width = CLAY_SIZING_GROW(0),
+	.height = CLAY_SIZING_GROW(0)
+};
+
+#endif // !STYLE_H

vendor/clay

@@ -1 +1 @@
-Subproject commit 0d6969c8c31375dab40c9cd0b0ad525eb50f3a29
+Subproject commit 37675089e33632173606bfccab554ad6e6970d4c