I don’t know if you have heard the nick name Temi. If you are a regular visitor of the various webmaster forums, you may find this name similar, but if you are a regular poster at the various virtual marketplaces you must know him pretty well.

Still doesn’t sound familiar?

OK, and if say Link bid script , or Haabaa directory?

Yes, Temi Odurinde has been in the web directory business for many years. It was more than a year ago, when he released an excellent article at this blog about the secret of successful directory managing. I think this is one of the best article ever posted here.

When I started to read his blog, I recognised that there are some exceptionally nice articles about web hosting, reflecting many year of experience and deep knowledge. If you are considering to get into web hosting, those writings are must.

I almost forget to mention that Temi is a huge fan of the different forums. He has plenty of them, but the best one is the UK WW SEO forum. Not a member yet?
What are you waiting for?

Have a nice further day!

For me the word CAPTCHA has only one meaning and it is PAIN, though I am convinced that we need it in order to protect our forms against spamming bots.

I considered that it would be really nice if we could provide a CAPTCHA script at our websites which gives an immediate feedback about the correctness of the typed password. I can hardly imagine more annoying thing than when after posting you need to recognize that the control number was false and your form was reseted as well.

After a couple of hour work it seems that I managed to compile a quite fancy method to handle this issue.

The html code of the input is the following:

<input name="seccode" type="text" id="seccode_id" size="20" onkeyup="count()" style="background-color:#FFFFFF"/>
<span id="ok"></span>

, it will receive evaluation from the JavaScript code below when a keyboard key is released (onkeyup event).


<script type="text/javascript">
function count(){
var desc = document.getElementById("seccode_id").value;
var code = "<?php echo rtrim(preg_replace('/(.)/', '$1%51%', $_SESSION['secword']));?>";
var result = code.replace(/%51%/gi, "");
var length = desc.length;
if (desc.slice(0,length)==result.slice(0,length))
{document.getElementById("seccode_id").style.backgroundColor="#E2FFB1";
document.getElementById("ok").innerHTML = "";}
else
{document.getElementById("seccode_id").style.backgroundColor="#DF625B";
document.getElementById("ok").innerHTML = "the last charcter you entered is invalid";}
if (length==0){
document.getElementById("seccode_id").style.backgroundColor="#FFFFFF";
document.getElementById("ok").style.visibility="hidden";}
if (length==6 && desc.slice(0,length)==result.slice(0,length)){
new Fx.Style('secur', 'opacity', {duration:1000}).start(1,0);
document.getElementById("ok").style.visibility="hidden";}}
</script>


The code has two inputs: the $_SESSION[’secword’] which is generated by the CAPTCHA script and the other one is the seccode input. Unfortunately I couldn’t avoid displaying the CAPTCHA string in the source hence I used the preg_replace php and the replace js function in order to mask it, inserting and deleting the %51% string among the chracters of the CAPTCHA.

The operation of the script in nutshell is the following. The JavaScript grabs the value of the input after every typed character, inspects its length and examine if the same length string of the CAPTCHA are identical with it. If the result is YES the background of the input will turn green, otherwise it will turn red and a warning message will be injected into the span element.

The last three lines are mostly for the fancy effect, when the typed and the generated strings are the same in their full length, the mootools framework will set the opacity of the containing div to 0.

Working demo

Have a nice further day!