Skip to content

Commit a61460a

Browse files
nesboxnesbox
committed
resize player using clay
1 parent 98b11cf commit a61460a

File tree

1 file changed

+114
-114
lines changed

1 file changed

+114
-114
lines changed

‎src/system/sokol/main.c‎

Lines changed: 114 additions & 114 deletions
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,11 @@ typedef struct
7575
sg_attachments att;
7676
} crt;
7777

78+
struct
79+
{
80+
Clay_BoundingBox box;
81+
} player;
82+
7883
sg_image image;
7984
sg_sampler linear;
8085
sg_sampler nearest;
@@ -553,46 +558,6 @@ static void init(void *userdata)
553558
Clay_Initialize(arena, (Clay_Dimensions) { sapp_widthf(), sapp_heightf() }, (Clay_ErrorHandler) { HandleClayErrors });
554559
}
555560

556-
typedef struct
557-
{
558-
float x, y, w, h;
559-
} Rect;
560-
561-
static Rect viewport(App *app)
562-
{
563-
float sw = sapp_widthf();
564-
float sh = sapp_heightf();
565-
566-
if(studio_config(app->studio)->options.integerScale)
567-
{
568-
sw -= sapp_width() % TIC80_FULLWIDTH;
569-
sh -= sapp_height() % TIC80_FULLHEIGHT;
570-
}
571-
572-
float widthRatio = sw / TIC80_FULLWIDTH;
573-
float heightRatio = sh / TIC80_FULLHEIGHT;
574-
float optimalSize = widthRatio < heightRatio ? widthRatio : heightRatio;
575-
float w = TIC80_FULLWIDTH * optimalSize;
576-
float h = TIC80_FULLHEIGHT * optimalSize;
577-
float x = (sapp_widthf() - w) / 2;
578-
float y = (sapp_heightf() - h) / 2;
579-
580-
return (Rect){x, y, w, h};
581-
}
582-
583-
static void drawImage(Rect r,sg_image image, sg_sampler sampler)
584-
{
585-
sgl_enable_texture();
586-
sgl_texture(image, sampler);
587-
sgl_begin_quads();
588-
sgl_v2f_t2f(r.x + 0, r.y + 0, 0, 0);
589-
sgl_v2f_t2f(r.x + r.w, r.y + 0, 1, 0);
590-
sgl_v2f_t2f(r.x + r.w, r.y + r.h, 1, 1);
591-
sgl_v2f_t2f(r.x + 0, r.y + r.h, 0, 1);
592-
sgl_end();
593-
sgl_disable_texture();
594-
}
595-
596561
static void threadedMode(App* app)
597562
{
598563
#if defined(__TIC_EMSCRIPTEN__)
@@ -629,68 +594,94 @@ static void checkrate(App* app)
629594
else threadedMode(app);
630595
}
631596

632-
static void clayupd(App *app)
597+
static void renderImage(Clay_BoundingBox b, sg_image image, sg_sampler sampler)
633598
{
634-
const Clay_Color COLOR_LIGHT = (Clay_Color) {224, 215, 210, 255};
635-
const Clay_Color COLOR_RED = (Clay_Color) {168, 66, 28, 255};
636-
const Clay_Color COLOR_ORANGE = (Clay_Color) {225, 138, 50, 255};
599+
sgl_enable_texture();
600+
sgl_texture(image, sampler);
601+
sgl_begin_quads();
602+
sgl_v2f_t2f(b.x + 0, b.y + 0, 0, 0);
603+
sgl_v2f_t2f(b.x + b.width, b.y + 0, 1, 0);
604+
sgl_v2f_t2f(b.x + b.width, b.y + b.height, 1, 1);
605+
sgl_v2f_t2f(b.x + 0, b.y + b.height, 0, 1);
606+
sgl_end();
607+
sgl_disable_texture();
608+
}
637609

638-
Clay_SetLayoutDimensions((Clay_Dimensions) { sapp_widthf(), sapp_heightf() });
639-
Clay_SetPointerState((Clay_Vector2) { app->pointer.x, app->pointer.y }, app->pointer.down);
610+
static void renderPlayer(App *app, Clay_BoundingBox b)
611+
{
612+
// !TODO: fix integer scale
613+
// if(studio_config(app->studio)->options.integerScale)
614+
// {
615+
// sw -= sapp_width() % TIC80_FULLWIDTH;
616+
// sh -= sapp_height() % TIC80_FULLHEIGHT;
617+
// }
640618

641-
Clay_BeginLayout();
619+
app->player.box = b;
642620

643-
CLAY(CLAY_ID("OuterContainer"),
644-
{
645-
.layout =
646-
{
647-
.sizing = {CLAY_SIZING_GROW(0), CLAY_SIZING_GROW(0)},
648-
.padding = CLAY_PADDING_ALL(16),
649-
},
650-
.backgroundColor = {}
651-
})
621+
bool crt = studio_config(app->studio)->options.crt;
622+
if(crt)
652623
{
653-
CLAY(CLAY_ID("SideBar"),
654-
{
655-
.layout =
656-
{
657-
.sizing = {CLAY_SIZING_FIXED(500), CLAY_SIZING_GROW(0)},
658-
},
659-
.backgroundColor = COLOR_ORANGE
660-
}){}
624+
renderImage(b, app->crt.image, app->linear);
661625

662-
CLAY(CLAY_ID("Content"),
663-
{
664-
.layout =
665-
{
666-
.sizing = {CLAY_SIZING_GROW(0), CLAY_SIZING_GROW(0)},
667-
},
668-
.backgroundColor = COLOR_RED
669-
}){}
626+
// draw crt
627+
sg_begin_pass(&(sg_pass)
628+
{
629+
.attachments = app->crt.att,
630+
});
631+
632+
sgl_context_draw(app->crt.ctx);
633+
sg_end_pass();
670634
}
635+
else
636+
{
637+
renderImage(b, app->image, app->nearest);
638+
}
639+
}
671640

672-
Clay_RenderCommandArray renderCommands = Clay_EndLayout();
641+
static void renderRect(Clay_BoundingBox b, Clay_Color c)
642+
{
643+
sgl_c4b(c.r, c.g, c.b, c.a);
644+
645+
sgl_begin_quads();
646+
sgl_v2f(b.x + 0, b.y + 0);
647+
sgl_v2f(b.x + b.width, b.y + 0);
648+
sgl_v2f(b.x + b.width, b.y + b.height);
649+
sgl_v2f(b.x + 0, b.y + b.height);
650+
sgl_end();
651+
}
652+
653+
static void renderCommands(App *app, Clay_RenderCommandArray renderCommands)
654+
{
655+
sgl_set_context(sgl_default_context());
656+
sgl_defaults();
657+
658+
sgl_matrix_mode_projection();
659+
sgl_ortho(0, sapp_widthf(), sapp_heightf(), 0, -1, +1);
673660

674661
for (s32 i = 0; i < renderCommands.length; i++)
675662
{
676-
Clay_RenderCommand *renderCommand = &renderCommands.internalArray[i];
663+
const Clay_RenderCommand *renderCommand = &renderCommands.internalArray[i];
677664

678665
switch (renderCommand->commandType)
679666
{
680667
case CLAY_RENDER_COMMAND_TYPE_RECTANGLE:
681668
{
682-
// Clay_RectangleRenderData *config = &renderCommand->renderData.rectangle;
683-
684669
Clay_BoundingBox b = renderCommand->boundingBox;
685670
Clay_Color c = renderCommand->renderData.rectangle.backgroundColor;
686671

687-
sgl_begin_quads();
688-
sgl_v2f_c4b(b.x + 0, b.y + 0, c.r, c.g, c.b, c.a);
689-
sgl_v2f_c4b(b.x + b.width, b.y + 0, c.r, c.g, c.b, c.a);
690-
sgl_v2f_c4b(b.x + b.width, b.y + b.height, c.r, c.g, c.b, c.a);
691-
sgl_v2f_c4b(b.x + 0, b.y + b.height, c.r, c.g, c.b, c.a);
692-
sgl_end();
672+
if(renderCommand->id == Clay_GetElementId(CLAY_STRING("Player")).id)
673+
{
674+
renderPlayer(app, b);
675+
}
676+
else
677+
{
678+
renderRect(b, c);
679+
}
680+
}
693681

682+
case CLAY_RENDER_COMMAND_TYPE_CUSTOM:
683+
{
684+
// !TODO: render player here instead rect
694685
}
695686

696687
default:
@@ -701,6 +692,39 @@ static void clayupd(App *app)
701692
}
702693
}
703694

695+
static void renderLayout(App *app)
696+
{
697+
const Clay_Color COLOR_BLACK = (Clay_Color) {.a = 255};
698+
699+
Clay_SetLayoutDimensions((Clay_Dimensions) { sapp_widthf(), sapp_heightf() });
700+
Clay_SetPointerState((Clay_Vector2) { app->pointer.x, app->pointer.y }, app->pointer.down);
701+
702+
Clay_BeginLayout();
703+
704+
CLAY(CLAY_ID("Layout"),
705+
{
706+
.layout =
707+
{
708+
.sizing = {CLAY_SIZING_GROW(), CLAY_SIZING_GROW()},
709+
.childAlignment = { .x = CLAY_ALIGN_X_CENTER, .y = CLAY_ALIGN_Y_CENTER },
710+
},
711+
})
712+
{
713+
CLAY(CLAY_ID("Player"),
714+
{
715+
.layout =
716+
{
717+
.sizing = {CLAY_SIZING_GROW(), CLAY_SIZING_GROW()},
718+
},
719+
720+
.aspectRatio = (float)TIC80_FULLWIDTH / TIC80_FULLHEIGHT,
721+
.backgroundColor = COLOR_BLACK,
722+
}){}
723+
}
724+
725+
renderCommands(app, Clay_EndLayout());
726+
}
727+
704728
static void frame(void *userdata)
705729
{
706730
App *app = userdata;
@@ -751,7 +775,7 @@ static void frame(void *userdata)
751775
sgl_push_pipeline();
752776
sgl_load_pipeline(app->crt.pip);
753777

754-
drawImage((Rect)
778+
renderImage((Clay_BoundingBox)
755779
{
756780
0, 0,
757781
TIC80_FULLWIDTH * CRT_SCALE,
@@ -762,31 +786,7 @@ static void frame(void *userdata)
762786
sgl_pop_pipeline();
763787
}
764788

765-
sgl_set_context(sgl_default_context());
766-
sgl_defaults();
767-
768-
sgl_matrix_mode_projection();
769-
sgl_ortho(0, sapp_widthf(), sapp_heightf(), 0, -1, +1);
770-
771-
if(crt)
772-
{
773-
drawImage(viewport(app), app->crt.image, app->linear);
774-
775-
// draw crt
776-
sg_begin_pass(&(sg_pass)
777-
{
778-
.attachments = app->crt.att,
779-
});
780-
781-
sgl_context_draw(app->crt.ctx);
782-
sg_end_pass();
783-
}
784-
else
785-
{
786-
drawImage(viewport(app), app->image, app->nearest);
787-
}
788-
789-
clayupd(app);
789+
renderLayout(app);
790790

791791
// draw screen
792792
sg_begin_pass(&(sg_pass)
@@ -965,9 +965,9 @@ static void processTouch(App *app, const sapp_touchpoint *touch)
965965
{
966966
tic80_input* input = &app->input;
967967

968-
Rect r = viewport(app);
969-
app->mouse.x = (touch->pos_x - r.x) * TIC80_FULLWIDTH / r.w;
970-
app->mouse.y = (touch->pos_y - r.y) * TIC80_FULLHEIGHT / r.h;
968+
Clay_BoundingBox b = app->player.box;
969+
app->mouse.x = (touch->pos_x - b.x) * TIC80_FULLWIDTH / b.width;
970+
app->mouse.y = (touch->pos_y - b.y) * TIC80_FULLHEIGHT / b.height;
971971
}
972972

973973
static void event(const sapp_event* event, void *userdata)
@@ -997,13 +997,13 @@ static void event(const sapp_event* event, void *userdata)
997997
break;
998998
case SAPP_EVENTTYPE_MOUSE_MOVE:
999999
{
1000-
Rect r = viewport(app);
1000+
Clay_BoundingBox b = app->player.box;
10011001

10021002
app->pointer.x = event->mouse_x;
10031003
app->pointer.y = event->mouse_y;
10041004

1005-
app->mouse.x = (event->mouse_x - r.x) * TIC80_FULLWIDTH / r.w;
1006-
app->mouse.y = (event->mouse_y - r.y) * TIC80_FULLHEIGHT / r.h;
1005+
app->mouse.x = (event->mouse_x - b.x) * TIC80_FULLWIDTH / b.width;
1006+
app->mouse.y = (event->mouse_y - b.y) * TIC80_FULLHEIGHT / b.height;
10071007
app->mouse.dx = event->mouse_dx;
10081008
app->mouse.dy = event->mouse_dy;
10091009
}

0 commit comments

Comments
 (0)