Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added custom placeholder for rendering CAPTCHA #6

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Added custom placeholder for rendering CAPTCHA #6

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
ec521dc
Added a possibility to specify custom placeholder for the CAPTCHA
ilich Mar 6, 2014
2c34af4
Do not allow to select CAPTCHA text.
ilich Mar 6, 2014
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions jquery.realperson.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,19 @@
.realperson-challenge {
display: block;
color: #000;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
}
.realperson-text {
font-family: "Courier New",monospace;
font-size: 6px;
font-weight: bold;
letter-spacing: -1px;
line-height: 3px;
cursor: default;
}
.realperson-regen {
padding-top: 4px;
Expand Down
18 changes: 15 additions & 3 deletions jquery.realperson.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@
/* Real person manager. */
function RealPerson() {
this._defaults = {
placeholder: null, // CAPTCHA container element (selector)
length: 6, // Number of characters to use
includeNumbers: false, // True to use numbers as well as letters
regenerate: 'Click to change', // Instruction text to regenerate
Expand Down Expand Up @@ -109,8 +110,14 @@ $.extend(RealPerson.prototype, {
options[name] = value;
}
$.extend(inst.options, options);
target.prevAll('.' + this.propertyName + '-challenge,.' + this.propertyName + '-hash').
remove().end().before(this._generateHTML(target, inst));
if (inst.options.placeholder == null) {
target.prevAll('.' + this.propertyName + '-challenge,.' + this.propertyName + '-hash').
remove().end().before(this._generateHTML(target, inst));
} else {
var placeholder = inst.options.placeholder;
$(placeholder).html(this._generateHTML(target, inst));
$(placeholder + ' > .' + this.propertyName + '-challenge').data('target-input', target);
}
},

/* Generate the additional content for this control.
Expand Down Expand Up @@ -228,7 +235,12 @@ var plugin = $.realperson = new RealPerson(); // Singleton instance

$(document).on('click', 'div.' + plugin.propertyName + '-challenge', function() {
if (!$(this).hasClass(plugin.propertyName + '-disabled')) {
$(this).nextAll('.' + plugin.markerClassName).realperson('option', {});
var targetInput = $(this).data('target-input');
if (targetInput && targetInput.length > 0) {
targetInput.realperson('option', {});
} else {
$(this).nextAll('.' + plugin.markerClassName).realperson('option', {});
}
}
});

Expand Down
17 changes: 14 additions & 3 deletions realPersonBasic.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,10 @@
<script type="text/javascript" src="jquery.realperson.js"></script>
<script type="text/javascript">
$(function() {
$('#defaultReal').realperson();
$('#defaultReal').realperson({
placeholder: '#captchaPlaceholder',
length: 7
});
});
</script>
</head>
Expand All @@ -26,8 +29,16 @@ <h1>jQuery Real Person</h1>
documentation reference</a> page.</p>
<form action="http://keith-wood.name/realPerson.php" method="post">
<p><label>Other fields:</label><input type="text" id="field"></p>
<p><label>Please enter the letters displayed:</label>
<input type="text" id="defaultReal" name="defaultReal"></p>
<table cellpadding="5">
<tr>
<td>&nbsp;</td>
<td id="captchaPlaceholder"></td>
<tr>
<tr>
<td nowrap><label>Please enter the letters displayed:</label></td>
<td><input type="text" id="defaultReal" name="defaultReal"></td>
</tr>
</table>
<p style="clear: both;"><label>&nbsp;</label><input type="submit" value="Submit"></p>
</form>
</body>
Expand Down