Heyy everyone,
This is just a quick Guide for the my new script : ZICS [ZONTEK's Interactive Combination System]. Pretty crazy, yup but this would be a nice feature to added to your site to catch up the users eyes. To tell the truth the idea is not original but i have rarely seen this implement within websites. So here what it is.
This script provides a simple grid where the user will be drawing or connecting dots and making a pattern of his wish. And then THIS WILL BE HIS PASSWORD. What actually given out by this is an array with 1's for the dots enabled and 0's for the dots disabled. hence the Password given out is pretty long and it will be a another security advantage that once it is hashed it would be a hell lot to crack.
Preview:
![[Image: demo.png]](https://lh3.googleusercontent.com/-Jqpzzo9G_wI/Tj7CpXpbhAI/AAAAAAAAAFg/z71NMWIHdcM/s800/demo.png)
Live Demo : http://expementa.freezoka.net/zics/index.php
Requirements:
Download the zics.zip file first : http://zontek.zzl.org/download.php?id=8
Usage:
1) There's only few steps to use the thing, first let's extract the file content to the folder login. You will have several files from that DELETE the index.php and demo.png [They are for testing]. Now let's make our own index.php. Add a link to the zicomb.css style on the header and a link to the JQUERY script of google's. This is really important as the script uses many jQuery functions. Now at last before the tag add a link to the zicomb.js script. This is how it looks like.
index.php
2) It's almost over but we just need to specify where to add the Combination Selector. For that we can place a div with id="pwd" anywhere in the script. And the script will add a hidden field with name pass which will later hold the input of the user. So we do better use the div inside a form so we can submit the password like we submit it with a usual booring text box
index.php
3) There you go! But there's a little bit remaining. That's some functions allowed by the script for customization.
4) Let's see index.php covering all those function and an example of getting the password with php
index.php
That's it! This script if all your to try/change/ edit or do anything but if you dont mind put up a link back
So that sum up the Guide for ZICS, newer versions with many fixes will come soon, till then enjoy !
Byee
Thankx
This is just a quick Guide for the my new script : ZICS [ZONTEK's Interactive Combination System]. Pretty crazy, yup but this would be a nice feature to added to your site to catch up the users eyes. To tell the truth the idea is not original but i have rarely seen this implement within websites. So here what it is.
This script provides a simple grid where the user will be drawing or connecting dots and making a pattern of his wish. And then THIS WILL BE HIS PASSWORD. What actually given out by this is an array with 1's for the dots enabled and 0's for the dots disabled. hence the Password given out is pretty long and it will be a another security advantage that once it is hashed it would be a hell lot to crack.
Preview:
Live Demo : http://expementa.freezoka.net/zics/index.php
Requirements:
Download the zics.zip file first : http://zontek.zzl.org/download.php?id=8
Usage:
1) There's only few steps to use the thing, first let's extract the file content to the folder login. You will have several files from that DELETE the index.php and demo.png [They are for testing]. Now let's make our own index.php. Add a link to the zicomb.css style on the header and a link to the JQUERY script of google's. This is really important as the script uses many jQuery functions. Now at last before the tag add a link to the zicomb.js script. This is how it looks like.
index.php
PHP Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>ZONTEKs Interactive Combination based Password System</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script><link href="zicomb.css" rel="stylesheet" type="text/css" />
</head>
<body>
<script type="text/javascript" src="zicomb.js"></script>
</body>
</html> 2) It's almost over but we just need to specify where to add the Combination Selector. For that we can place a div with id="pwd" anywhere in the script. And the script will add a hidden field with name pass which will later hold the input of the user. So we do better use the div inside a form so we can submit the password like we submit it with a usual booring text box
index.php
PHP Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>ZONTEKs Interactive Combination based Password System</title>
<script type="text/javascript" src="../newest/script/jquery.js"></script><link href="zicomb.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form action="index.php" method="post">
Username : <input type="text" name="user" size="25" />
Password :
<div id="pwd">
<!-- This is the block where everything is added
and here another field is adden secretly
ex: <input type=hidden name="pass" value="11100101010...." />
and that holds our data -->
</div>
<input type="submit" name="done" value="Login" />
</form>
<script type="text/javascript" src="zicomb.js"></script>
</body>
</html> 3) There you go! But there's a little bit remaining. That's some functions allowed by the script for customization.
PHP Code:
setSize(row,col) //This will change the default number of rows and columns to your number. PHP Code:
allowMulti() //If you call this function, it will make the buttons get activated while hovring above them 4) Let's see index.php covering all those function and an example of getting the password with php
index.php
PHP Code:
<?phpif(isset($_POST['done'])){
$pwd = $_POST['pass'];
if(md5($pwd) == md5("111110001000100010001111")){
echo "Login Succesfull! <br />";
}else echo "LOGIN FAILED!";
}?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>ZONTEK's Interactive Combination based Password System</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
<link href="zicomb.css" rel="stylesheet" type="text/css" />
</head>
<body>
<h1 align="center">ZONTEK's Interactive Combination System (ZICS)</h1>
<p align="center">The new way of typing your password, by ZONTEK. To use just click the necessary dots.
Implementation details available from the <a href="http://manzzup.blogspot.com">blog.</a>
@company: ZONTEK
@author: ManZzup@zonware
Coded on: 07/08/2011
</p>
<form action="index.php" method="post">
Username : <input type="text" name="user" size="25" />
Password :
<div id="pwd">
</div>
<input type="button" value="Allow MouseOver Selection" onclick="allowMulti();" />
<input type="submit" name="done" value="Login" />
</form>
Use the following to test the DEMO:
<img src="demo.png" />
<script type="text/javascript" src="zicomb.js"></script>
</body>
</html> That's it! This script if all your to try/change/ edit or do anything but if you dont mind put up a link back
So that sum up the Guide for ZICS, newer versions with many fixes will come soon, till then enjoy !
Byee
Thankx
No comments:
Post a Comment