diff options
Diffstat (limited to 'Text TV BornHack/index.md')
| -rw-r--r-- | Text TV BornHack/index.md | 134 |
1 files changed, 134 insertions, 0 deletions
diff --git a/Text TV BornHack/index.md b/Text TV BornHack/index.md new file mode 100644 index 0000000..5cf16f5 --- /dev/null +++ b/Text TV BornHack/index.md @@ -0,0 +1,134 @@ +--- +description: Website imitating teletext aka *Tekst-TV* featuring schedule +created: 2024-07-07 +--- + +## --> [text-tv.bornhack.node5.net](https://text-tv.bornhack.node5.net/) <-- + + + + + +## Idea + +This years BornHack (2024) will feature an even cooler Pixelflut setup, which inspired me to make something for it. +An important goal was to have something with a low barrier of entry to interact with it. +My first idea involved a keyboard presented at the Pixelflut setup, +allowing one to type messages to be displayed on screen. +Then later i got the idea to make it Text TV themed, this works well with the nerdy culture, and allows me to add a +schedule, and get user interaction through a "news" section. + +### Mock up + + + +### Inspiration + <iframe src="https://www.dr.dk/cgi-bin/fttv1.exe/100" style="border:none;height:490px;width:320px" title="Tekst TV - dr.dk"></iframe> + +--- + +## Renderer coding + +### Text rendering in C using pango & cairo + +Based on a cairo pixel flut code sample from a fellow hacker, which i could expand to import and image, rather easily, +and render text, which worked, but it was anti aliased, making it look horible in the small format. + + + +Top is gimp mock up text, +bottom is pango cairo rendered text + +### Turning off anti aliasing + +This was annoying, because `cairo_set_antialias(cr, CAIRO_ANTIALIAS_NONE);` didn't work, +it had to be done in pango context. + +[Change font rendering (non-antialiased) with pango - stackoverflow.com](https://stackoverflow.com/questions/16106659/change-font-rendering-non-antialiased-with-pango#answer-73221211) + +An answer in this stack overflow question, mentions that: +*"In C you can turn off anti-aliasing when drawing with Pangocairo like this:"* +```c +cairo_font_options_t *options = cairo_font_options_create(); +cairo_font_options_set_antialias(options, CAIRO_ANTIALIAS_NONE); +pango_cairo_context_set_font_options(context, options); +cairo_font_options_destroy(options); +``` + +Next problem then, is getting the context. + +I found out how to do this in: [pango examples cairoshape.c - gitlab.com](https://gitlab.gnome.org/GNOME/pango/-/blob/239e030e4f38f0b7b899a8a405437601daf2860d/examples/cairoshape.c#L137) + +Using `layout = pango_cairo_create_layout (cr);` and `pango_layout_get_context (layout);` + +This means i can now turn off, anti aliasing + +Here's a code sample: + +```c + cairo_surface_t *surface; + cairo_t *cr; + + surface = cairo_image_surface_create_for_data( + f->image, f->format, + f->width, f->height, f->stride); + cr = cairo_create(surface); + + //cairo_scale (cr, 2, 2); + //cairo_set_antialias(cr, CAIRO_ANTIALIAS_NONE); + + int w, h; + cairo_surface_t *image; + + image = cairo_image_surface_create_from_png ("../base.png"); + w = cairo_image_surface_get_width (image); + h = cairo_image_surface_get_height (image); + //cairo_translate (cr, 0, 1080 - h); + + cairo_set_source_surface (cr, image, 0, 0); + cairo_paint (cr); + + // Set up the Pango Cairo context + PangoLayout *layout = pango_cairo_create_layout(cr); + PangoFontDescription *font_desc = pango_font_description_from_string("Monospace 7"); + //pango_font_description_set_size(font_desc, 8 * PANGO_SCALE); + pango_layout_set_font_description(layout, font_desc); + pango_font_description_free(font_desc); + + // Turn off antialias + PangoContext *pango_context = pango_layout_get_context (layout); + cairo_set_antialias(cr, CAIRO_ANTIALIAS_NONE); + cairo_font_options_t *options = cairo_font_options_create(); + cairo_font_options_set_antialias(options, CAIRO_ANTIALIAS_NONE); + pango_cairo_context_set_font_options(pango_context, options); + cairo_font_options_destroy(options); + + // Move + cairo_translate (cr, 6, 115); + + // Set the text to display + pango_layout_set_text(layout, "Hello World!", -1); + + // Render the layout + cairo_set_source_rgb(cr, 1, 1, 1); // Set color to white + pango_cairo_show_layout(cr, layout); + + // Clean up + g_object_unref(layout); + + + cairo_destroy (cr); + cairo_surface_destroy(surface); +``` + +Which renderes non-anti-aliased text + + + +Again, top is gimp mock up text, +bottom is pango cairo rendered text + +--- + +So 2024 Bornhack happened, sadly the pixel flut screen died, so i shifted from pixel flut to a website. +Which was featured at the bar in 2024 and in our village in 2025 |