/
example.html
92 lines (85 loc) · 4.45 KB
/
example.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>jQuery.pidCrypt plugin demo</title>
<!-- this stylesheet was ripped from an article on net tuts -->
<link rel="stylesheet" href="libs/css/style.css" type="text/css" media="screen" />
<!-- load jQuery -->
<script src="http://code.jquery.com/jquery.min.js"></script>
<!-- pidCrypt RSA libraries (minified versions) -->
<script src="libs/js/pidCrypt/javascripts/compressed/pidcrypt_c.js"></script>
<script src="libs/js/pidCrypt/javascripts/compressed/pidcrypt_util_c.js"></script>
<script src="libs/js/pidCrypt/javascripts/compressed/md5_c.js"></script>
<script src="libs/js/pidCrypt/javascripts/compressed/sha512_c.js"></script>
<script src="libs/js/pidCrypt/javascripts/compressed/asn1_c.js"></script>
<script src="libs/js/pidCrypt/javascripts/compressed/jsbn_c.js"></script>
<script src="libs/js/pidCrypt/javascripts/compressed/rng_c.js"></script>
<script src="libs/js/pidCrypt/javascripts/compressed/prng4_c.js"></script>
<script src="libs/js/pidCrypt/javascripts/compressed/rsa_c.js"></script>
<!-- pidCrypt AES-CBC libraries (minified versions) -->
<script src="libs/js/pidCrypt/javascripts/compressed/aes_core_c.js"></script>
<script src="libs/js/pidCrypt/javascripts/compressed/aes_cbc_c.js"></script>
<!-- jQuery.pidCrypt plugin library -->
<script src="libs/js/jquery.pidCrypt.min.js"></script>
</head>
<body>
<div style="width:70%; word-wrap:break-word">
<h2><strong>jQuery pidCrypt plugin demo's</strong></h2>
<p style="text-align:center">
<blockquote>
Uses the <a href="https://www.pidder.com/pidcrypt/" target="_blank">
pidCrypt encryption</a> libraries along with the
<a href="http://php.net/manual/en/book.openssl.php" target="_blank">
PHP OpenSSL</a> functionality to encrypt form data, sign emails and
encrypt and sign emails using RSA encryption.
</blockquote>
</p>
<!-- example using default method -->
<script>
var $j = jQuery.noConflict();
$j(document).ready(function() {
function _details(data) {
if (typeof data=='object') {
//data = JSON.parse(data);
$j('#message').html('<p><b>Server response...</b></p><p><i>(decrypted data is used in this as a demo only!)</i>. Please use implementation guide associated with this project.</p>');
$j.each(data, function(k, v){
if (typeof v=='object') {
$j('#message').append('<b>'+k+'</b>:<br/>');
$j.each(v, function(x, y){
$j('#message').append('<b>'+x+'</b>: '+y+'<br/>');
});
} else {
$j('#message').append('<b>'+k+'</b>: '+v+'<br/>');
}
});
}
}
$j('#cc').pidCrypt({callback: function(){ _details(this); }});
});
</script>
<div id="contact-form" class="clearfix">
<h3>Public key encryption example</h3>
<div id="message"></div>
<form id="cc" name="cc" style="cc" method="post" action="tests/default.php">
<label for="name">Name: <span class="required">*</span></label>
<input type="text" id="name" name="name" value="" placeholder="John Doe" required="required" />
<label for="email">Email Address: <span class="required">*</span></label>
<input type="email" id="email" name="email" value="" placeholder="johndoe@example.com" required="required" />
<label for="type">Visa: </label>
<input name="type" id="type" value="visa" type="radio" class="data" checked="checked" required="required" />
<label for="type">Mastercard: </label>
<input name="type" id="type" value="mastercard" type="radio" class="data" required="required" />
<label for="type">American Express: </label>
<input name="type" id="type" value="americanexpress" type="radio" class="data" required="required" />
<label for="card-number">Card number: <span class="required">*</span></label>
<input type="text" name="card-number" id="card-number" value="" placeholder="1234567890" required="required" />
<label for="message">Message: <span class="required">*</span></label>
<textarea id="message" name="message" placeholder="Your message must be greater than 20 charcters" required="required" data-minlength="20"></textarea>
<span id="loading"></span>
<input type="submit" value="Encrypt & Send" id="submit-button" />
<p id="req-field-desc"></p>
</form>
</div>
</body>
</html>