[examples] Fix shaders_ascii_rendering (#5219)

* Add ascii post processing

* Fix broken characters and add more comments

* Rename example

* Refactored as requested
This commit is contained in:
Maicon Santana
2025-09-30 17:34:06 +01:00
committed by GitHub
parent 0e2e8ce225
commit a553fbd0c7
5 changed files with 125 additions and 79 deletions

View File

@@ -10,58 +10,71 @@ varying vec4 finalColor;
uniform sampler2D texture0;
uniform vec2 resolution;
// Fontsize less then 9 may be not complete
uniform float fontSize;
float greyScale(in vec3 col) {
float GreyScale(in vec3 col)
{
return dot(col, vec3(0.2126, 0.7152, 0.0722));
}
float character(float n, vec2 p)
float GetCharacter(float n, vec2 p)
{
p = floor(p * vec2(4.0, -4.0) + 2.5);
// Check if the coordinate is inside the 5x5 grid (0 to 4).
if (clamp(p.x, 0.0, 4.0) == p.x && clamp(p.y, 0.0, 4.0) == p.y) {
if (int(mod(n / exp2(p.x + 5.0 * p.y), 2.0)) == 1) {
return 1.0; // The bit is on, so draw this part of the character.
p = floor(p*vec2(-4.0, 4.0) + 2.5);
// Check if the calculated coordinate is inside the 5x5 grid (from 0.0 to 4.0)
if (clamp(p.x, 0.0, 4.0) == p.x && clamp(p.y, 0.0, 4.0) == p.y)
{
float a = floor(p.x + 0.5) + 5.0*floor(p.y + 0.5);
// This checked if the 'a'-th bit of 'n' was set
float shiftedN = floor(n/pow(2.0, a));
if (mod(shiftedN, 2.0) == 1.0)
{
return 1.0; // The bit is on
}
}
return 0.0; // The bit is off, or we are outside the grid.
return 0.0; // The bit is off, or we are outside the grid
}
// -----------------------------------------------------------------------------
// Main shader logic
// -----------------------------------------------------------------------------
void main()
{
vec2 charPixelSize = vec2(fontSize, fontSize * 1.8);
vec2 uvCellSize = charPixelSize / resolution;
vec2 charPixelSize = vec2(fontSize, fontSize);
vec2 uvCellSize = charPixelSize/resolution;
vec2 cellUV = floor(fragTexCoord / uvCellSize) * uvCellSize;
// The cell size is based on the fontSize set by application
vec2 cellUV = floor(fragTexCoord/uvCellSize)*uvCellSize;
vec3 cellColor = texture2D(texture0, cellUV).rgb;
float gray = greyScale(cellColor);
float n = 4096;
// Gray is used to define what character will be selected to draw
float gray = GreyScale(cellColor);
float n = 4096.0;
// limited character set
// Character set from https://www.shadertoy.com/view/lssGDj
// Create new bitmaps https://thrill-project.com/archiv/coding/bitmap/
if (gray > 0.2) n = 65600.0; // :
if (gray > 0.3) n = 163153.0; // *
if (gray > 0.3) n = 18725316.0; // v
if (gray > 0.4) n = 15255086.0; // o
if (gray > 0.5) n = 13121101.0; // &
if (gray > 0.6) n = 15252014.0; // 8
if (gray > 0.7) n = 13195790.0; // @
if (gray > 0.8) n = 11512810.0; // #
vec2 localUV = (fragTexCoord - cellUV) / uvCellSize; // Range [0.0, 1.0]
vec2 localUV = (fragTexCoord - cellUV)/uvCellSize; // Range [0.0, 1.0]
vec2 p = localUV * 2.0 - 1.0;
vec2 p = localUV*2.0 - 1.0; // Range [-1.0, 1.0]
float charShape = character(n, p);
// cellColor and charShape will define the color of the char
vec3 color = cellColor*GetCharacter(n, p);
vec3 final_col = cellColor * charShape;
gl_FragColor = vec4(final_col, 1.0);
gl_FragColor = vec4(color, 1.0);
}

View File

@@ -8,58 +8,71 @@ varying vec4 finalColor;
uniform sampler2D texture0;
uniform vec2 resolution;
// Fontsize less then 9 may be not complete
uniform float fontSize;
float greyScale(in vec3 col) {
float GreyScale(in vec3 col)
{
return dot(col, vec3(0.2126, 0.7152, 0.0722));
}
float character(float n, vec2 p)
float GetCharacter(float n, vec2 p)
{
p = floor(p * vec2(4.0, -4.0) + 2.5);
// Check if the coordinate is inside the 5x5 grid (0 to 4).
if (clamp(p.x, 0.0, 4.0) == p.x && clamp(p.y, 0.0, 4.0) == p.y) {
if (int(mod(n / exp2(p.x + 5.0 * p.y), 2.0)) == 1) {
return 1.0; // The bit is on, so draw this part of the character.
p = floor(p*vec2(-4.0, 4.0) + 2.5);
// Check if the calculated coordinate is inside the 5x5 grid (from 0.0 to 4.0)
if (clamp(p.x, 0.0, 4.0) == p.x && clamp(p.y, 0.0, 4.0) == p.y)
{
float a = floor(p.x + 0.5) + 5.0*floor(p.y + 0.5);
// This checked if the 'a'-th bit of 'n' was set
float shiftedN = floor(n/pow(2.0, a));
if (mod(shiftedN, 2.0) == 1.0)
{
return 1.0; // The bit is on
}
}
return 0.0; // The bit is off, or we are outside the grid.
return 0.0; // The bit is off, or we are outside the grid
}
// -----------------------------------------------------------------------------
// Main shader logic
// -----------------------------------------------------------------------------
void main()
{
vec2 charPixelSize = vec2(fontSize, fontSize * 1.8);
vec2 charPixelSize = vec2(fontSize, fontSize);
vec2 uvCellSize = charPixelSize / resolution;
vec2 cellUV = floor(fragTexCoord / uvCellSize) * uvCellSize;
// The cell size is based on the fontSize set by application
vec2 cellUV = floor(fragTexCoord / uvCellSize)*uvCellSize;
vec3 cellColor = texture2D(texture0, cellUV).rgb;
float gray = greyScale(cellColor);
float n = 4096;
// Gray is used to define what character will be selected to draw
float gray = GreyScale(cellColor);
float n = 4096.0;
// limited character set
// Character set from https://www.shadertoy.com/view/lssGDj
// Create new bitmaps https://thrill-project.com/archiv/coding/bitmap/
if (gray > 0.2) n = 65600.0; // :
if (gray > 0.3) n = 163153.0; // *
if (gray > 0.3) n = 18725316.0; // v
if (gray > 0.4) n = 15255086.0; // o
if (gray > 0.5) n = 13121101.0; // &
if (gray > 0.6) n = 15252014.0; // 8
if (gray > 0.7) n = 13195790.0; // @
if (gray > 0.8) n = 11512810.0; // #
vec2 localUV = (fragTexCoord - cellUV) / uvCellSize; // Range [0.0, 1.0]
vec2 localUV = (fragTexCoord - cellUV)/uvCellSize; // Range [0.0, 1.0]
vec2 p = localUV * 2.0 - 1.0;
vec2 p = localUV*2.0 - 1.0; // Range [-1.0, 1.0]
float charShape = character(n, p);
// cellColor and charShape will define the color of the char
vec3 color = cellColor*GetCharacter(n, p);
vec3 final_col = cellColor * charShape;
gl_FragColor = vec4(final_col, 1.0);
gl_FragColor = vec4(color, 1.0);
}

View File

@@ -8,6 +8,8 @@ out vec4 finalColor;
uniform sampler2D texture0;
uniform vec2 resolution;
// Fontsize less then 9 may be not complete
uniform float fontSize;
float GreyScale(in vec3 col)
@@ -15,16 +17,17 @@ float GreyScale(in vec3 col)
return dot(col, vec3(0.2126, 0.7152, 0.0722));
}
float GetCharacter(float n, vec2 p)
float GetCharacter(int n, vec2 p)
{
p = floor(p*vec2(4.0, -4.0) + 2.5);
p = floor(p*vec2(-4.0, 4.0) + 2.5);
// Check if the coordinate is inside the 5x5 grid (0 to 4)
if (clamp(p.x, 0.0, 4.0) == p.x && clamp(p.y, 0.0, 4.0) == p.y)
{
if (int(mod(n/exp2(p.x + 5.0 * p.y), 2.0)) == 1)
int a = int(round(p.x) + 5.0*round(p.y));
if (((n >> a) & 1) == 1)
{
return 1.0; // The bit is on, so draw this part of the character
return 1.0;
}
}
@@ -34,30 +37,37 @@ float GetCharacter(float n, vec2 p)
// -----------------------------------------------------------------------------
// Main shader logic
// -----------------------------------------------------------------------------
void main()
{
vec2 charPixelSize = vec2(fontSize, fontSize*1.8);
vec2 charPixelSize = vec2(fontSize, fontSize);
vec2 uvCellSize = charPixelSize/resolution;
// The cell size is based on the fontSize set by application
vec2 cellUV = floor(fragTexCoord/uvCellSize)*uvCellSize;
vec3 cellColor = texture(texture0, cellUV).rgb;
// Gray is used to define what character will be selected to draw
float gray = GreyScale(cellColor);
float n = 4096;
int n = 4096;
// Limited character set
if (gray > 0.2) n = 65600.0; // :
if (gray > 0.3) n = 163153.0; // *
if (gray > 0.4) n = 15255086.0; // o
if (gray > 0.5) n = 13121101.0; // &
if (gray > 0.6) n = 15252014.0; // 8
if (gray > 0.7) n = 13195790.0; // @
if (gray > 0.8) n = 11512810.0; // #
// Character set from https://www.shadertoy.com/view/lssGDj
// Create new bitmaps https://thrill-project.com/archiv/coding/bitmap/
if (gray > 0.2) n = 65600; // :
if (gray > 0.3) n = 18725316; // v
if (gray > 0.4) n = 15255086; // o
if (gray > 0.5) n = 13121101; // &
if (gray > 0.6) n = 15252014; // 8
if (gray > 0.7) n = 13195790; // @
if (gray > 0.8) n = 11512810; // #
vec2 localUV = (fragTexCoord - cellUV)/uvCellSize; // Range [0.0, 1.0]
vec2 p = localUV*2.0 - 1.0;
float charShape = GetCharacter(n, p);
vec2 p = localUV*2.0 - 1.0; // Range [-1.0, 1.0]
finalColor = vec4(cellColor*charShape, 1.0);
vec3 color = cellColor*GetCharacter(n, p);
finalColor = vec4(color, 1.0);
}