ft_libgfx AKA b_gfx overload

NEWS UPDATE: New Projects Coming!

Hello everyone, hope you are staying safe. We have new projects coming with the new cursus in 2020. The information here should stay relevant but I look forward to updating it when we get the new subjects.

Greetings b_gfx'rs and hackers alike! For your reading pleasure, dark-mode is on github-pages.

To make it easier to work with, I will be explaining and looking into the 42 School Graphics Library Minilibx.

Oh wait what is this?

Oh! It's a shameless plug for my latest video game: Hexcross

I've been back working in this type of project now (escaping from web, database and other duties) so look forward to more screen shots and juice knowledge as I find it. Probably a refactor of this resource at some point too...

Want to beta test our upcoming game?

Without futher ado:

To make it easier to work with, I will be explaining and looking into the 42 School Graphics Library Minilibx.

I have uploaded all the minilibx sources for viewing and use. [X11] [El Capitan] [Sierra]

Along with this goal I plan to create a set of resources and functions that can be used to make different types of computer graphics programs. The resources will be aimed at helping others create great 42 graphics projects and encouraging graphics side projects.

The Graphics Branch

The goals of the graphics branch projects can be put simply:

Rasterisation, show a wireframe from a file
Render trippy colored mandelbrot and julia set
Create a ray caster game engine like wolfenstein
Build a 'first try' ray tracer
Work with a team to build a feature rich ray tracer

Let's get started.

Graphics Branch Link Dump

Anything even slightly useful for coming to a better understanding of gfx

ft_wireframe

ft_fractal

wolf3d

rt_v1

misc

Wikipedia Links

MiniLibX

The keystone of the 42 graphics branch is learning to use MiniLibX

Besides some old videos on intra, you are given the source and the man pages to figure it out.

To help demystify the man pages I took a moment and formatted them for markdown.

MiniLibX is described in the following man pages:

mlx : MiniLibX overview
mlx_new_window : manage windows
mlx_pixel_put : draw inside window
mlx_new_image : manipulate images
mlx_loop : handle keyboard or mouse events

Take some time and read these pages, if you want to read them in the console:

man minilibx/man/man1/mlx.1

The last part is the man page name, read them all.

mlx.1
mlx_new_window.1
mlx_pixel_put.1
mlx_new_image.1
mlx_loop.1

I have done my best to use markdown to make a more readable experience on github.

That being said, man page formatting in the console is intresting too.

Check out one of the man files to see the syntax, this one is mlx.1.

Once you have done that, try to open a window using the mlx functions.

If you get stuck, here is a short example:

#include <mlx.h>

int main(void)
{
  void *mlx;
  void *window;
  
  mlx = mlx_init();
  window = mlx_new_window(mlx, 1000, 1000, "Title");
  
  mlx_loop(mlx);
  return (0);
}

gcc -Wall -Wextra -Werror -I minilibx -L minilibx -lmlx -framework OpenGL -framework AppKit main.c

Remember, where this line above says minilibx yours might say something like minilibx_macos_sierra it's simply the name of the folder with mlx built in it. Speaking of which, be sure to build mlx like so: cd <mlxfolder> make

I certainly encourage you to figure out as much as you can with just the man pages and tinkering.

But at a certain point, you should show what you've learned and learn from others.

Getting started with fdf (ft_wireframe)

Well first of all, check out all the juicy details they give us.

It's a solid set of guidelines but nowhere to start. 42 Classic. But it won't be like this the whole way. Since the system is set up this way I would highly recommend experementing with any ideas you have right now. Get comfortable trying to make something happen, use events, loops and anything else you found in the man pages.

Once you have done this, you should already be thinking about:

Bresenham's line algorithm

Drawing a line, various curves and shapes are normally handled by a graphics library. At 42 we will doing all of this from scratch, minilibx is not feature rich for some reason. Since we are rendering a grid, that line algorithm is where we need to start. The link above is to a very detailed proof of the algorithm. In the links below you can find more on the subject.

That's all for now, find me if you have any more questions or suggestions for the fdf section.

This part of the guide is a work in progress, ask if you have a question for now

There are more resources, examples and inspiration [in the link dump].(#graphics-branch-link-dump)

Getting started with fractol (ft_fractal)

There are many good resources on this adventure in computer graphics, but I would argue the best place to start is on paper.

Look up imaginary numbers. Throw some numbers into the function for the mandelbrot.

f(x) = z² + c

Real numbers, imaginary numbers then complex numbers. Here is a guide

It would seem to me the key to this project, like any other, is to get hands on and experement.

Here is a macro for formula that might be useful:

Scale a range to a known min and max

#define RANGE_CHANGE(x,a,b,min,max) (((b)-(a))*((x)-(min))/((max)-(min)))+(a)

This part of the guide is a work in progress, ask if you have a question for now

There are more resources, examples and inspiration [in the link dump].(#graphics-branch-link-dump)

More key event control - keys.h

To solve the problem of knowning when many keys have been pressed I have made a struct of all the keys.

This file allows the programmer to use the minilibx loop hook to fire off events on key held.

A quick synopsis of the code:

#define KEY_A 0
#define KEY_S 1
#define KEY_D 2
...

typedef struct  s_keys
{
  int           a:1;
  int           s:1;
  int           d:1;
  ...
}               t_keys

I really like an idea I saw on the evil corp entry for the 42 Hackathon in 2016.

Where you use a constant string of all the letters to turn the keycode into it's matching printable output

It looks like this:

bqweryt123465=97-80]ou[ip lj\"k;\\,/nm.  ` 	. * +   / -  =012345

They used it to type input on to the screen along with mlx_string_put()

I'm sure it could be used for more! I'm thinking about making a typing game 😉

What about events?

It's a good idea to experement with the events they mention in the man pages, but there is more than that!

Check out the mlx_loop man page, at the bottom is says to look at mlx_int_param_event.c

In this code we can see:

int	(*(mlx_int_param_event[]))() =
{
  mlx_int_param_undef,   /* 0 */
  mlx_int_param_undef,
  mlx_int_param_KeyPress,
  mlx_int_param_KeyRelease,  /* 3 */
  mlx_int_param_ButtonPress,
  mlx_int_param_ButtonRelease,
  mlx_int_param_MotionNotify,  /* 6 */
  ...

This can help you make sense of the command mlx_hook in mlx_hook.c

We can create our own key hooks with this information:

void	set_hooks(t_view *v)
{
	mlx_do_key_autorepeatoff(v->mlx);
	mlx_hook(v->window, 2, 0, key_press_hook, v);
	mlx_hook(v->window, 3, 0, key_release_hook, v);
	mlx_hook(v->window, 4, 0, mouse_press_hook, v);
	mlx_hook(v->window, 5, 0, mouse_release_hook, v);
	mlx_hook(v->window, 6, 0, motion_hook, v);
	mlx_hook(v->window, 12, 0, expose_hook, v);
	mlx_hook(v->window, 17, 0, exit_hook, v);
}