close ad
WARNING: Do Not Install the DREAMWEAVER CC 2017 Update »
open ad
View Menu

Technical Support Forums

Free, outstanding support from WebAssist and your colleagues

rating

Captcha graphic in css form builder

Thread began 8/20/2010 11:49 am by gwh362692 | Last modified 9/02/2010 11:46 am by Jason Byrnes | 1441 views | 15 replies |

gwh362692

Captcha graphic in css form builder

Hi all,

I'm trying to alter the clarity of a captcha graphic created with CSS form builder. I went into the wizard along this path:

Edit design > Form elements > captcha

I tried changing things like, the noise, font, grid etc. then I press apply and finished the wizard but the graphic doesn't change. I've tried it about 10 times and it doesn't work.

Can anyone point out what I'm doing wrong?

Thanks in advance.

Sign in to reply to this post

Jason ByrnesWebAssist

That is the correct way to go about editing the captcha properties, I just tested on a form I created and the changes are being made.

the changes are applied as query string variables to the WAVT_CaptchaSecurityImages.php file. For example, the changes I made in my test changed the img tag from:
<img src="WA_ValidationToolkit/WAVT_CaptchaSecurityImages.php?field=Log_in_group_Security_code&font=Fonts/MOM_T___.TTF" alt="Security Code" class="Captcha" />


to:
<img src="WA_ValidationToolkit/WAVT_CaptchaSecurityImages.php?field=Log_in_group_Security_code&bgcolor=FF6633&transparent=false&noisefreq=25&noisecolor=99CCCC&gridfreq=50&gridcolor=999999&gridorder=0&font=Fonts/MOM_T___.TTF&characters=7" alt="Security Code" class="Captcha" />


can you see any changes in the image source on your page?

Sign in to reply to this post

gwh362692

Thanks for the reply,

The following is the content of my WAVT_CaptchaSecurityImages.php:

<code>
<?php
session_start();
class WA_Captcha {
function randomString($numChars) {
$useChars = '2345679bcdhkmnrstwxzADEFHJKLMNPRSTWXYZ';
$str = '';
for ($x = 0; $x < $numChars; $x++) {
$str .= substr($useChars, rand(0, strlen($useChars)-1), 1);
}
return $str;
}

function hexToRGB($color) {
if ($color[0] == '#')
$color = substr($color, 1);
if (strlen($color) == 6)
list($r, $g, $b) = array($color[0].$color[1],
$color[2].$color[3],
$color[4].$color[5]);
elseif (strlen($color) == 3)
list($r, $g, $b) = array($color[0].$color[0], $color[1].$color[1], $color[2].$color[2]);
else
return false;
$r = hexdec($r); $g = hexdec($g); $b = hexdec($b);
return array($r, $g, $b);
}

function addGrid($image,$freq,$width,$height,$color) {
if ($freq != 0) {
$frequency = (101-$freq);
// horizontal line
$numLines = ceil($height/$frequency);
$shift = rand(1,$frequency-1);
for( $i=0; $i<$numLines; $i++ ) {
imageline($image, 0, ($frequency*$i)+$shift, $width, ($frequency*$i)+$shift, $color);
}
// vertical line
$numLines = ceil($width/$frequency);
$shift = rand(1,$frequency-1);
for( $i=0; $i<$numLines; $i++ ) {
imageline($image, ($frequency*$i)+$shift, 0, ($frequency*$i)+$shift, $height, $color);
}
// backslash line
$numLines = ceil($width/$frequency);
$shift = rand(1,$frequency-1);
for( $i=0; $i<$numLines; $i++ ) {
imageline($image, ($frequency*$i)+$shift+$frequency, 0, ($frequency*$i)+$shift, $height, $color);
}
// slash line
$numLines = ceil($width/$frequency);
$shift = rand(1,$frequency-1);
for( $i=0; $i<$numLines; $i++ ) {
imageline($image, ($frequency*$i)+$shift, 0, ($frequency*$i)+$shift+$frequency, $height, $color);
}
}
}

function addNoise($image,$freq,$width,$height,$color) {
if ($freq != 0) {
$frequency = $freq;
// random noise
$noiseSpots = ($width*$height*($frequency/20))/5;
for( $i=0; $i<$noiseSpots; $i++ ) {
imagefilledellipse($image, rand(0,$width), rand(0,$height), 1, 1, $color);
}
// random line
$numLines = (($height/60)*sqrt($width*$height)*($frequency/20))/5;
for( $i=0; $i<$numLines; $i++ ) {
imageline($image, rand(0,$width), rand(0,$height), rand(0,$width), rand(0,$height), $color);
}
}
}

function WA_Captcha($width,$height,$characters,$bg_color,$text_color,$noise_color,$font,$field,$transparent,$bgimage,$gridfreq,$grid_color,$gridorder,$noisefreq,$noiseorder,$charheight) {
$font = realpath($font);
$font_size = $charheight;
if ($bgimage != "") {
$image_size = getimagesize($bgimage);
if (strpos($bgimage,".gif") > 0) {
$captchaBG = imagecreatefromgif($bgimage);
}
else if (strpos($bgimage,".png") > 0) {
$captchaBG = imagecreatefrompng($bgimage);
}
else {
$captchaBG = imagecreatefromjpeg($bgimage);
}
}
$captcha = imagecreatetruecolor($width, $height);
$ystart=0;


$bgColor = $this->hexToRGB($bg_color);
$txtColor = $this->hexToRGB($text_color);
$noiseColor = $this->hexToRGB($noise_color);
$gridColor = $this->hexToRGB($grid_color);

$background_color = imagecolorallocate($captcha, $bgColor[0], $bgColor[1], $bgColor[2]);
$text_color = imagecolorallocate($captcha, $txtColor[0], $txtColor[1], $txtColor[2]);
$noise_color = imagecolorallocate($captcha, $noiseColor[0], $noiseColor[1], $noiseColor[2]);
$grid_color = imagecolorallocate($captcha, $gridColor[0], $gridColor[1], $gridColor[2]);

imagefilledrectangle($captcha,0,0,$width,$height,$background_color);
if ($transparent == 1) imagecolortransparent($captcha, $background_color);

if ($bgimage != "") {
while($ystart<=$height) {
$xstart=0;
while($xstart<=$width) {
imagecopy($captcha, $captchaBG, $xstart, $ystart, 0, 0, $image_size[0], $image_size[1]);
$xstart += $image_size[0];
}
$ystart += $image_size[1];
}
}
if ($noiseorder != "in front of text") {
$this->addNoise($captcha,$noisefreq,$width,$height,$noise_color);
}
if ($gridorder != "in front of text") {
$this->addGrid($captcha,$gridfreq,$width,$height,$grid_color);
}
$captcha_string = $this->randomString($characters);
$y = -1;
while ($y < 0 || ($textbox[4] > $width)) {
$textbox = imagettfbbox($font_size, 0, $font, $captcha_string);
$y = ($height - $textbox[5])/2;
if ($y < 0 || ($textbox[4] > $width)) {
$font_size = 0.9 * $font_size;
}
}
$totWidth = 0;
$charWidths = array();

for ($charLen=0;$charLen<$characters;$charLen++) {
$tilt = rand(-15,15);
$charWidth = imagettfbbox($font_size, $tilt, $font, $captcha_string[$charLen]);
$tilts[] = $tilt;
$charWidths[] = $charWidth[4];
$totWidth += $charWidth[4];
}
$space = ($width-$totWidth)/($characters+2);
$x = $space*1.5;

for ($charLen=0;$charLen<$characters;$charLen++) {
imagettftext($captcha, $font_size, $tilts[$charLen], $x, $y, $text_color, $font , $captcha_string[$charLen]);
$x += $charWidths[$charLen]+$space;
}

if ($noiseorder == "in front of text") {
$this->addNoise($captcha,$noisefreq,$width,$height,$noise_color);
}
if ($gridorder == "in front of text") {
$this->addGrid($captcha,$gridfreq,$width,$height,$grid_color);
}
header('Content-Type: image/png');
imagepng($captcha);
imagedestroy($captcha);

if (!session_id()) session_start();
$_SESSION["captcha_".$field] = $captcha_string;
}
}

$width = isset($_GET['width']) && $_GET['width'] != "" ? $_GET['width'] : '120';
$height = isset($_GET['height']) && $_GET['height'] != "" ? $_GET['height'] : '40';
$characters = isset($_GET['characters']) && $_GET['characters'] > 2 ? $_GET['characters'] : '5';
$bgcolor = isset($_GET['bgcolor']) && $_GET['bgcolor'] != "" ? $_GET['bgcolor'] : 'FFFFFF';
$textcolor = isset($_GET['textcolor']) && $_GET['textcolor'] != "" ? $_GET['textcolor'] : '000000';
$noisecolor = isset($_GET['noisecolor']) && $_GET['noisecolor'] != "" ? $_GET['noisecolor'] : '000000';
$font = isset($_GET['font']) && $_GET['font'] != "" ? $_GET['font'] : 'Fonts/MOM_T___.TTF';
$field = isset($_GET['field']) && $_GET['field'] != "" ? $_GET['field'] : '1';
$transparent = isset($_GET['transparent']) && $_GET['transparent'] != "" ? $_GET['transparent'] : '0';

$bgimage = isset($_GET['bgimage']) && $_GET['bgimage'] != "" ? $_GET['bgimage'] : '';
$gridfreq = isset($_GET['gridfreq']) && $_GET['gridfreq'] != "" ? $_GET['gridfreq'] : '50';
$gridcolor = isset($_GET['gridcolor']) && $_GET['gridcolor'] != "" ? $_GET['gridcolor'] : '000000';
$gridorder = isset($_GET['gridorder']) && $_GET['gridorder'] != "" ? $_GET['gridorder'] : '';
$noisefreq = isset($_GET['noisefreq']) && $_GET['noisefreq'] != "" ? $_GET['noisefreq'] : '50';
$noiseorder = isset($_GET['noiseorder']) && $_GET['noiseorder'] != "" ? $_GET['noiseorder'] : '';
$charheight = isset($_GET['charheight']) && $_GET['charheight'] != "" ? $_GET['charheight'] : $height*0.75;

/*
Fonts/MACTYPE.TTF
Fonts/MODERNA_.TTF
Fonts/MOM_T___.TTF
Fonts/monofont.ttf
*/
$captcha = new WA_Captcha($width,$height,$characters,$bgcolor,$textcolor,$noisecolor,$font,$field,$transparent,$bgimage,$gridfreq,$gridcolor,$gridorder,$noisefreq,$noiseorder,$charheight);

?>
</code>

I did a search for the code you gave, ie.

<img src="WA_ValidationToolkit/WAVT_CaptchaSecurityImages.php?field=Log_in_group_Security_code&font=Fonts/MOM_T___.TTF" alt="Security Code" class="Captcha" />

but it didn't exist in the file.

Should it be there?

Sign in to reply to this post

Jason ByrnesWebAssist

the image code will not be in the WAVT_CaptchaSecurityImages.php file, it will be in your form page.

Sign in to reply to this post

gwh362692

Before changing anything, the code was as follows:

<img src="../WA_ValidationToolkit/WAVT_CaptchaSecurityImages.php?field=Send_enquiry_group_Security_code&transparent=false&font=Fonts/MODERNA_.TTF" alt="Security Code" class="Captcha" />

Then I changed the following:

1) the font family to Moderna
2) grid size to none
3) noise amount to none

And the code changed to the this:

<img src="../WA_ValidationToolkit/WAVT_CaptchaSecurityImages.php?field=Send_enquiry_group_Security_code&transparent=false&noisefreq=25&gridfreq=50&font=Fonts/MACTYPE.TTF" alt="Security Code" class="Captcha" />

But the captcha image doesn't look any different. I mean the noise is completely the same even though I set it to none.

I'm using Mac OS 10.5.8. Could this be a bug?

Sign in to reply to this post

Jason ByrnesWebAssist

can you send a link where can see the issue?

Sign in to reply to this post

gwh362692

Sorry about the delay in getting back about this issue.

You can see it at the following url:

contact

In addition to the captcha problem, if you type in the security incorrectly and then press submit, the form just reloads. It doesn't send any of the information and there's no cue to the person filling in the form that there was any error. Is this a bug and if so is it fixable?

Sign in to reply to this post

Jason ByrnesWebAssist

when i view source of you page, the image tag does not appear to heave changed:
<img class="Captcha" alt="Security Code" src="WA_ValidationToolkit/WAVT_CaptchaSecurityImages.php?field=Send_enquiry_group_Security_code&transparent=false&font=Fonts/MODERNA_.TTF">


make sure that the upload of the contact page is actually completeing successfully, Dreamweaver can be problematic when uploading files, i often add a visual change to the page such as adding today's date so i can be sure the page uploaded successfully.



for the validation failure issue, find the following code:

php:
if ($WAFV_Errors != "")  {

    PostResult($WAFV_Redirect,$WAFV_Errors,"confirm");
  }



and change it to:

php:
if ($WAFV_Errors != "")  {

    die($WAFV_Errors);
    PostResult($WAFV_Redirect,$WAFV_Errors,"confirm");
  }




this will write a comma separated list of failed validations to the screen post this back with copy of your page in a zip archive and I will be able to troubleshoot the issue.

Sign in to reply to this post

gwh362692

The page did upload correctly. That's actually the code I have on my local site. I changed it again but the font is definitely not Moderna and the noise is still really heavy.

Regarding the code you asked me to find, the closest I could find was:

if ($WAFV_Errors != "") {
PostResult($WAFV_Redirect,$WAFV_Errors,"contactform");
}

There was no other code that included the "confirm" part. I even even did a site wide search and couldn't find it. I don't know what's going on.

Sign in to reply to this post

Jason ByrnesWebAssist

I will need you to upload the code to the server so i can see the issue to troubleshoot it.


this is the correct code:

if ($WAFV_Errors != "") {
PostResult($WAFV_Redirect,$WAFV_Errors,"contactform");
}




change it to:

if ($WAFV_Errors != "") {
die($WAFV_Errors);
PostResult($WAFV_Redirect,$WAFV_Errors,"contactform");
}
Sign in to reply to this post
loading

Build websites with a little help from your friends

Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.

Build websites from already-built web applications

These out-of-the-box solutions provide you proven, tested applications that can be up and running now.  Build a store, a gallery, or a web-based email solution.

Want your website pre-built and hosted?

Close Windowclose

Rate your experience or provide feedback on this page

Account or customer service questions?
Please user our contact form.

Need technical support?
Please visit support to ask a question

Content

rating

Layout

rating

Ease of use

rating

security code refresh image

We do not respond to comments submitted from this page directly, but we do read and analyze any feedback and will use it to help make your experience better in the future.

Close Windowclose

We were unable to retrieve the attached file

Close Windowclose

Attach and remove files

add attachmentAdd attachment
Close Windowclose

Enter the URL you would like to link to in your post

Close Windowclose

This is how you use right click RTF editing

Enable right click RTF editing option allows you to add html markup into your tutorial such as images, bulleted lists, files and more...

-- click to close --

Uploading file...