MetzNet
/
roleplay
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Made ui boxes require 4 colors, added hsv-colored-rect ui object type

main
noah metz 2024-11-12 11:56:57 -07:00
parent 8278692494
commit 22b6c6a5ae
6 changed files with 70 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
client/include/ui.h
Unescape Escape View File

@ -76,12 +76,9 @@ typedef struct GPUStringStruct {
typedef struct GPUDrawableStruct { typedef struct GPUDrawableStruct {
vec2 pos; vec2 pos;
vec2 size; vec2 size;
vec4 color; vec4 color[4];
uint32_t type; uint32_t type;
uint32_t var1; uint32_t var;
uint32_t var2;
float var3;
float var4;
uint32_t id; uint32_t id;
} GPUDrawable; } GPUDrawable;

8
client/shader/string.comp
Unescape Escape View File

@ -19,9 +19,11 @@ void main() {
pc.layer.drawables.d[buffer_pos + i].pos = string.pos + pen; pc.layer.drawables.d[buffer_pos + i].pos = string.pos + pen;
pen += string.size*symbol.advance; pen += string.size*symbol.advance;
pc.layer.drawables.d[buffer_pos + i].size = vec2(string.size, string.size); pc.layer.drawables.d[buffer_pos + i].size = vec2(string.size, string.size);
pc.layer.drawables.d[buffer_pos + i].color = string.color; pc.layer.drawables.d[buffer_pos + i].color[0] = string.color;
pc.layer.drawables.d[buffer_pos + i].var1 = code; pc.layer.drawables.d[buffer_pos + i].color[1] = string.color;
pc.layer.drawables.d[buffer_pos + i].var2 = string.font; pc.layer.drawables.d[buffer_pos + i].color[2] = string.color;
pc.layer.drawables.d[buffer_pos + i].color[3] = string.color;
pc.layer.drawables.d[buffer_pos + i].var = code + (string.font << 16);
pc.layer.drawables.d[buffer_pos + i].type = 1; pc.layer.drawables.d[buffer_pos + i].type = 1;
} }
} }

29
client/shader/ui.frag
Unescape Escape View File

@ -12,13 +12,36 @@ layout(set = 3, binding = 0) uniform texture2D textures[];
layout(location = 0) in vec4 fragColor; layout(location = 0) in vec4 fragColor;
layout(location = 1) in vec2 fragUV; layout(location = 1) in vec2 fragUV;
layout(location = 2) flat in uint code; layout(location = 2) flat in uint glyph;
layout(location = 3) flat in uint index; layout(location = 3) flat in uint index;
layout(location = 4) flat in uint type; layout(location = 4) flat in uint type;
layout(location = 5) flat in vec2 container_offset; layout(location = 5) flat in vec2 container_offset;
layout(location = 0) out vec4 outColor; layout(location = 0) out vec4 outColor;
vec4 hsv_to_rgb(vec4 hsv) {
float C = hsv[1] * hsv[2];
float H = hsv[0]*6;
float X = C * (1 - abs(mod(H, 2) - 1));
vec4 temp;
if(0 <= H && H <= 1) {
temp = vec4(C, X, 0, 0);
} else if(1 <= H && H <= 2) {
temp = vec4(X, C, 0, 0);
} else if(2 <= H && H <= 3) {
temp = vec4(0, C, X, 0);
} else if(3 <= H && H <= 4) {
temp = vec4(0, X, C, 0);
} else if(4 <= H && H <= 5) {
temp = vec4(X, 0, C, 0);
} else if(5 <= H && H <= 6) {
temp = vec4(C, 0, X, 0);
}
float m = hsv[2] - C;
return vec4(temp[0] + m, temp[1] + m, temp[2] + m, hsv[3]);
}
void main() { void main() {
vec2 pos = (gl_FragCoord.xy - vec2(0.5, 0.5))/pc.layer.container.context.scale; vec2 pos = (gl_FragCoord.xy - vec2(0.5, 0.5))/pc.layer.container.context.scale;
vec2 min = container_offset; vec2 min = container_offset;
@ -30,9 +53,11 @@ void main() {
if(type == 0) { if(type == 0) {
outColor = fragColor; outColor = fragColor;
} else if(type == 1) { } else if(type == 1) {
outColor = fragColor * texture(sampler2DArray(font_textures[index], font_samplers[index]), vec3(fragUV, code)); outColor = fragColor * texture(sampler2DArray(font_textures[index], font_samplers[index]), vec3(fragUV, glyph));
} else if (type == 2) { } else if (type == 2) {
outColor = fragColor * texture(sampler2D(textures[index], samplers[index]), fragUV); outColor = fragColor * texture(sampler2D(textures[index], samplers[index]), fragUV);
} else if (type == 3) {
outColor = hsv_to_rgb(fragColor);
} }
} }

25
client/shader/ui.vert
Unescape Escape View File

@ -5,11 +5,15 @@
layout(location = 0) out vec4 fragColor; layout(location = 0) out vec4 fragColor;
layout(location = 1) out vec2 fragUV; layout(location = 1) out vec2 fragUV;
layout(location = 2) out flat uint var1; layout(location = 2) out flat uint glyph;
layout(location = 3) out flat uint var2; layout(location = 3) out flat uint index;
layout(location = 4) out flat uint type; layout(location = 4) out flat uint type;
layout(location = 5) out flat vec2 container_offset; layout(location = 5) out flat vec2 container_offset;
const uint color_index[6] = {
0, 1, 2, 1, 3, 2
};
const vec2 square[6] = { const vec2 square[6] = {
vec2(0.0, 0.0), vec2(0.0, 0.0),
vec2(1.0, 0.0), vec2(1.0, 0.0),
@ -43,22 +47,23 @@ void main() {
container_offset = pc.layer.container.offset + vec2(pc.layer.container.context.extent.x - pc.layer.container.size.x, pc.layer.container.context.extent.y - pc.layer.container.size.y); container_offset = pc.layer.container.offset + vec2(pc.layer.container.context.extent.x - pc.layer.container.size.x, pc.layer.container.context.extent.y - pc.layer.container.size.y);
} }
if(drawable.type == 1){ if(drawable.type == 1) {
// Glyph index = (drawable.var >> 16) & 0xFFFF;
Font font = pc.layer.container.context.fonts.f[drawable.var2]; glyph = drawable.var & 0xFFFF;
Symbol symbol = font.symbols.s[drawable.var1]; Font font = pc.layer.container.context.fonts.f[index];
Symbol symbol = font.symbols.s[glyph];
fragUV = pos * vec2(symbol.width, symbol.height); fragUV = pos * vec2(symbol.width, symbol.height);
pos = pos * vec2(symbol.width, symbol.height) + vec2(symbol.left, -symbol.top); pos = pos * vec2(symbol.width, symbol.height) + vec2(symbol.left, -symbol.top);
} else { } else if(drawable.type == 2) {
fragUV = pos; fragUV = pos;
index = drawable.var;
} }
gl_Position = vec4((pos * drawable.size + drawable.pos + container_offset) * pc.layer.container.context.screen * 2, 0.0, 1.0) - vec4(1.0, 1.0, 0.0, 0.0); gl_Position = vec4((pos * drawable.size + drawable.pos + container_offset) * pc.layer.container.context.screen * 2, 0.0, 1.0) - vec4(1.0, 1.0, 0.0, 0.0);
fragColor = drawable.color; fragColor = drawable.color[color_index[gl_VertexIndex]];
type = drawable.type; type = drawable.type;
var1 = drawable.var1;
var2 = drawable.var2;
} }

7
client/shader/ui_common.glsl
Unescape Escape View File

@ -59,12 +59,9 @@ layout(std430, buffer_reference) readonly buffer CodeList {
struct Drawable { struct Drawable {
vec2 pos; vec2 pos;
vec2 size; vec2 size;
vec4 color; vec4 color[4];
uint type; uint type;
uint var1; uint var;
uint var2;
float var3;
float var4;
uint id; uint id;
}; };

37
client/src/main.c
Unescape Escape View File

@ -117,96 +117,97 @@ VkResult color_ui(ClientContext* context) {
{ {
.pos = {0, 0}, .pos = {0, 0},
.size = {190, 150}, .size = {190, 150},
.color = {0.4, 0.4, 0.4, 0.4}, .color = {{0.4, 0.4, 0.4, 0.4}, {0.4, 0.4, 0.4, 0.4}, {0.4, 0.4, 0.4, 0.4}, {0.4, 0.4, 0.4, 0.4}},
}, },
{ {
.type = 0x03,
.pos = {2, 2}, .pos = {2, 2},
.size = {130, 130}, .size = {130, 130},
.color = {1, 1, 1, 1}, .color = {{0, 0, 1, 1}, {0, 1, 1, 1}, {0, 0, 0, 1}, {0, 1, 0, 1}},
.id = 0x01, .id = 0x01,
}, },
{ {
.type = 0x03,
.pos = {134, 2}, .pos = {134, 2},
.size = {10, 130}, .size = {10, 130},
.color = {1, 1, 1, 1}, .color = {{0, 1, 1, 1}, {0, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
.id = 0x02, .id = 0x02,
}, },
{ {
.pos = {20, 134}, .pos = {20, 134},
.size = {95, 15}, .size = {95, 15},
.color = {0, 0, 1, 0},
.id = 0x03, .id = 0x03,
}, },
{ {
.pos = {146, 2}, .pos = {146, 2},
.size = {20, 20}, .size = {20, 20},
.color = {1, 1, 1, 1}, .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
.id = 0x04, .id = 0x04,
}, },
{ {
.pos = {168, 2}, .pos = {168, 2},
.size = {20, 20}, .size = {20, 20},
.color = {1, 1, 1, 1}, .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
.id = 0x05, .id = 0x05,
}, },
{ {
.pos = {146, 24}, .pos = {146, 24},
.size = {20, 20}, .size = {20, 20},
.color = {1, 1, 1, 1}, .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
.id = 0x06, .id = 0x06,
}, },
{ {
.pos = {168, 24}, .pos = {168, 24},
.size = {20, 20}, .size = {20, 20},
.color = {1, 1, 1, 1}, .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
.id = 0x07, .id = 0x07,
}, },
{ {
.pos = {146, 46}, .pos = {146, 46},
.size = {20, 20}, .size = {20, 20},
.color = {1, 1, 1, 1}, .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
.id = 0x08, .id = 0x08,
}, },
{ {
.pos = {168, 46}, .pos = {168, 46},
.size = {20, 20}, .size = {20, 20},
.color = {1, 1, 1, 1}, .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
.id = 0x09, .id = 0x09,
}, },
{ {
.pos = {146, 68}, .pos = {146, 68},
.size = {20, 20}, .size = {20, 20},
.color = {1, 1, 1, 1}, .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
.id = 0x0A, .id = 0x0A,
}, },
{ {
.pos = {168, 68}, .pos = {168, 68},
.size = {20, 20}, .size = {20, 20},
.color = {1, 1, 1, 1}, .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
.id = 0x0B, .id = 0x0B,
}, },
{ {
.pos = {146, 90}, .pos = {146, 90},
.size = {20, 20}, .size = {20, 20},
.color = {1, 1, 1, 1}, .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
.id = 0x0C, .id = 0x0C,
}, },
{ {
.pos = {168, 90}, .pos = {168, 90},
.size = {20, 20}, .size = {20, 20},
.color = {1, 1, 1, 1}, .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
.id = 0x0D, .id = 0x0D,
}, },
{ {
.pos = {146, 112}, .pos = {146, 112},
.size = {20, 20}, .size = {20, 20},
.color = {1, 1, 1, 1}, .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
.id = 0x0E, .id = 0x0E,
}, },
{ {
.pos = {168, 112}, .pos = {168, 112},
.size = {20, 20}, .size = {20, 20},
.color = {1, 1, 1, 1}, .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
.id = 0x0F, .id = 0x0F,
}, },
}; };
@ -309,7 +310,7 @@ VkResult hex_info_ui(ClientContext* context) {
{ {
.pos = {0, 0}, .pos = {0, 0},
.size = {150, 175}, .size = {150, 175},
.color = {0.4, 0.4, 0.4, 0.4}, .color = {{0.4, 0.4, 0.4, 0.4}, {0.4, 0.4, 0.4, 0.4}, {0.4, 0.4, 0.4, 0.4}, {0.4, 0.4, 0.4, 0.4}},
}, },
}; };
@ -375,7 +376,7 @@ VkResult region_info_ui(ClientContext* context) {
{ {
.pos = {0, 0}, .pos = {0, 0},
.size = {225, 155}, .size = {225, 155},
.color = {0.4, 0.4, 0.4, 0.4}, .color = {{0.4, 0.4, 0.4, 0.4}, {0.4, 0.4, 0.4, 0.4}, {0.4, 0.4, 0.4, 0.4}, {0.4, 0.4, 0.4, 0.4}},
}, },
}; };