CAPTCHA anti-aliasing

[Der Spark]

The letter graphic used for the new CAPTCHA system is anti-aliased for a white or light-colored background, which can result in the letters being almost completely unreadable on a theme with a dark-colored background (mine is black).

I figured out how to fix this, but it involves editing Subs-Graphics.php in the Sources folder. Basically, you look for the settings for the foreground and, especially, background color (about lines 1286-1287, or search for "showCodeImage($code)") of the letters and change 'em to colors that match your theme. I used Photoshop to get the right RGB values.

[nend]

I did something similiar.  But I have two custom themes and want seperate color scemes for the CAPTCHA for each.  So I modified Subs-Graphics.php towards the bottom like so.

Koodi [Valitse] Laajenna


// Create the image for the visual verification code.
function showCodeImage($code)
{
global $settings;

// The amount of pixels inbetween characters.
$character_spacing = 1;

// Check to see if there is a color template in the current theme.  If not return to the default.
if (is_file($settings['theme_dir'] . '/fonts/color_settings.php'))
{
// Lets include those custom color settings.
require_once($settings['theme_dir'] . '/fonts/color_settings.php');
$posthfonts = '1';
$posthfontsdir = $settings['theme_dir'] . '/fonts/';
}
elseif (!is_file($settings['theme_dir'] . '/fonts/color_settings.php'))
{
// The color of the characters shown (red, green, blue).
$foreground_color = array(64, 101, 136);
$background_color = array(236, 237, 243);
$posthfontsdir = $settings['default_theme_dir'] . '/fonts/';
}

// If there is another font folder lets check if there is fonts there also.  If not load the default fonts.
if ($psthfonts = '1') {
$font_dir = dir($settings['theme_dir'] . '/fonts');
$font_list = array();
while ($entry = $font_dir->read())
if (preg_match('~^(.+)\.gdf$~', $entry, $matches) === 1)
$font_list[] = $entry;
}

// If the font list is still empty lets try the default theme.
if (empty($font_list)) {
$font_dir = dir($settings['default_theme_dir'] . '/fonts');
$font_list = array();
while ($entry = $font_dir->read())
if (preg_match('~^(.+)\.gdf$~', $entry, $matches) === 1)
$font_list[] = $entry;
}

if (empty($font_list))
return false;

// Create a list of characters to be shown.
$characters = array();
$loaded_fonts = array();
for ($i = 0; $i < strlen($code); $i++)
{
$characters[$i] = array(
'id' => $code{$i},
'font' => array_rand($font_list),
);

$loaded_fonts[$characters[$i]['font']] = null;
}

// Load all fonts and determine the maximum font height.
foreach ($loaded_fonts as $font_index => $dummy)
$loaded_fonts[$font_index] = imageloadfont($posthfontsdir . '' . $font_list[$font_index]);

// Determine the dimensions of each character.
$total_width = $character_spacing * strlen($code) - 1;
$max_height = 0;
foreach ($characters as $char_index => $character)
{
$characters[$char_index]['width'] = imagefontwidth($loaded_fonts[$character['font']]);
$characters[$char_index]['height'] = imagefontheight($loaded_fonts[$character['font']]);

$max_height = max($characters[$char_index]['height'], $max_height);
$total_width += $characters[$char_index]['width'];
}

// Create an image.
$code_image = imagecreate($total_width, $max_height);

// Draw the background.
$bg_color = imagecolorallocate($code_image, $background_color[0], $background_color[1], $background_color[2]);
imagefilledrectangle($code_image, 0, 0, $total_width - 1, $max_height - 1, $bg_color);

// Randomize the foreground color a little.
for ($i = 0; $i < 3; $i++)
$foreground_color[$i] = rand(max($foreground_color[$i] - 3, 0), min($foreground_color[$i] + 3, 255));

// Fill in the characters.
$cur_x = 0;
foreach ($characters as $char_index => $character)
{
// Rotating the characters a little...
if (function_exists('imagerotate'))
{
$char_image = function_exists('imagecreatetruecolor') ? imagecreatetruecolor($character['width'], $character['height']) : imagecreate($character['width'], $character['height']);
$char_bgcolor = imagecolorallocate($char_image, $background_color[0], $background_color[1], $background_color[2]);
imagefilledrectangle($char_image, 0, 0, $character['width'] - 1, $character['height'] - 1, $char_bgcolor);
imagechar($char_image, $loaded_fonts[$character['font']], 0, 0, $character['id'], imagecolorallocate($char_image, rand(max($foreground_color[0] - 2, 0), $foreground_color[0]), rand(max($foreground_color[1] - 2, 0), $foreground_color[1]), rand(max($foreground_color[2] - 2, 0), $foreground_color[2])));
$rotated_char = imagerotate($char_image, rand(-100, 100) / 10, $char_bgcolor);
imagecopy($code_image, $rotated_char, $cur_x, 0, 0, 0, $character['width'], $character['height']);
imagedestroy($rotated_char);
imagedestroy($char_image);
}

// Sorry, no rotation available.
else
imagechar($code_image, $loaded_fonts[$character['font']], $cur_x, floor(($max_height - $character['height']) / 2), $character['id'], imagecolorallocate($code_image, rand(max($foreground_color[0] - 2, 0), $foreground_color[0]), rand(max($foreground_color[1] - 2, 0), $foreground_color[1]), rand(max($foreground_color[2] - 2, 0), $foreground_color[2])));

$cur_x += $character['width'] + $character_spacing;
}

// Make the background color transparent.
imagecolortransparent($code_image, $bg_color);

// Add some randomness to the background.
$randomness_color = imagecolorallocate($code_image, rand(max($foreground_color[0] - 3, 0), min($foreground_color[0] + 3, 255)), rand(max($foreground_color[1] - 3, 0), min($foreground_color[1] + 3, 255)), rand(max($foreground_color[2] - 3, 0), min($foreground_color[2] + 3, 255)));
for ($i = 0; $i < $max_height; $i++)
for ($j = rand(0, 6); $j < $total_width; $j += rand(1, 10))
imagesetpixel($code_image, $j, $i, $randomness_color);

// Show the image.
if (function_exists('imagegif'))
{
header('Content-type: image/gif');
imagegif($code_image);
}
else
{
header('Content-type: image/png');
imagepng($code_image);
}

// Bail out.
imagedestroy($code_image);
die();
}

// Create a letter for the visual verification code.
function showLetterImage($letter)
{
global $settings;

if (!is_dir($settings['default_theme_dir'] . '/fonts'))
return false;

// Get a list of the available font directories.
$font_dir = dir($posthfontsdir);
$font_list = array();
while ($entry = $font_dir->read())
if ($entry{0} !== '.' && is_dir($posthfontsdir . '' . $entry))
$font_list[] = $entry;

if (empty($font_list))
return false;

// Pick a random font.
$random_font = $font_list[array_rand($font_list)];

// Check if the given letter exists.
if (!file_exists($posthfontsdir . '' . $random_font . '/' . $letter . '.gif'))
return false;

// Include it!
header('Content-type: image/gif');
include($posthfontsdir . '' . $random_font . '/' . $letter . '.gif');

// Nothing more to come.
die();
}

?>


Then I made a folder called fonts in each of my theme folders.  Uploaded what GDF fonts I thought where appropriate for the theme.  Then added a custom color file called color_settings.php.

color_settings.php

Koodi [Valitse] Laajenna


<?php
$foreground_color = array(64, 101, 136);
$background_color = array(236, 237, 243);
?>


What do you think?

[nend]

Here I think I got the colors the way I want.

This is what you get afterwards.  I changed the fonts, didn't like the default ones.

http://www.sicomm.us/index.php?action=register