I was working on this project for a while (3-4 days) and finally it is completed.
Being a beginner in html5/css3 programming this is quite an archievement for me, to be frank.
I didnt plan to create such a thing right from the start, it just came to my mind whn i made this draw a number thing in javascript, that I could use this tech to generate a random captcha, so I did it.
here is the link,
https://dl.dropbox.com/u/84253825/Showcase/Captcha/captcha%201.0.html
How it works ?
First , the javascript generates a random number between 1000 and 9999 , using the function
.png)
function random(i,j){return Math.round(Math.random()*j) +i }
this number is stored in a variable.
NOw I made a library to draw integers on the html5 canvas, I call this library and few functions and draw this number on canvas.
Now i conver this canvas to a .jpg image and display it on the browser.
the canvas is hidden, so to the user it seems like the image has been generated by the server or something, but in reality all these steps takes place in the client side, in the browser of the users computer.
Future Improvements
>expand the library to include alphabets also.
>twist or waarp the canvas a bit.
>add colors to the canvas
>after this is done thiink about making a client side text incryptor (encrypt text in images)
Being a beginner in html5/css3 programming this is quite an archievement for me, to be frank.
I didnt plan to create such a thing right from the start, it just came to my mind whn i made this draw a number thing in javascript, that I could use this tech to generate a random captcha, so I did it.
here is the link,
https://dl.dropbox.com/u/84253825/Showcase/Captcha/captcha%201.0.html
How it works ?
First , the javascript generates a random number between 1000 and 9999 , using the function
.png)
function random(i,j){return Math.round(Math.random()*j) +i }this number is stored in a variable.
NOw I made a library to draw integers on the html5 canvas, I call this library and few functions and draw this number on canvas.
Now i conver this canvas to a .jpg image and display it on the browser.
the canvas is hidden, so to the user it seems like the image has been generated by the server or something, but in reality all these steps takes place in the client side, in the browser of the users computer.
Future Improvements>expand the library to include alphabets also.
>twist or waarp the canvas a bit.
>add colors to the canvas
>after this is done thiink about making a client side text incryptor (encrypt text in images)