add steganograpy example
This commit is contained in:
parent
37f3bf8f51
commit
036d51e7b5
5 changed files with 127 additions and 0 deletions
17
examples/steganography/css/example.css
Normal file
17
examples/steganography/css/example.css
Normal file
|
@ -0,0 +1,17 @@
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
table {
|
||||||
|
border-spacing: 8px;
|
||||||
|
}
|
||||||
|
td {
|
||||||
|
padding: 0;
|
||||||
|
border-collapse: collapse;
|
||||||
|
font-family: Lucida Grande, Segoe UI, DejaVu Sans, Lucida Sans Unicode, Helvetica, Arial, sans-serif;
|
||||||
|
font-size: 12px;
|
||||||
|
vertical-align: top;
|
||||||
|
//background: red;
|
||||||
|
}
|
||||||
|
td:first-child {
|
||||||
|
width: 320px;
|
||||||
|
}
|
13
examples/steganography/index.html
Normal file
13
examples/steganography/index.html
Normal file
|
@ -0,0 +1,13 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Steganograpy</title>
|
||||||
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||||
|
<link rel="shortcut icon" type="image/png" href="../../source/Ox.UI/png/icon16.png"/>
|
||||||
|
<link rel="stylesheet" type="text/css" href="css/example.css"/>
|
||||||
|
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||||
|
<script type="text/javascript" src="js/example.js"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
</body>
|
||||||
|
</html>
|
97
examples/steganography/js/example.js
Normal file
97
examples/steganography/js/example.js
Normal file
|
@ -0,0 +1,97 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
Ox.load('Image', function() {
|
||||||
|
|
||||||
|
var $body = Ox.$('body'),
|
||||||
|
$table = Ox.$('<table>').appendTo($body),
|
||||||
|
$tr,
|
||||||
|
text = {
|
||||||
|
iceland: 'The first image he told me about '
|
||||||
|
+ 'was of three children on a road in Iceland in 1965.',
|
||||||
|
vietnam: 'He said for him it was the image of happiness, '
|
||||||
|
+ 'and that he had often tried to link it to other images, '
|
||||||
|
+ 'but it had never worked.'
|
||||||
|
},
|
||||||
|
i = 0;
|
||||||
|
|
||||||
|
encode(decode);
|
||||||
|
|
||||||
|
function encode(callback) {
|
||||||
|
status('Load iceland.png');
|
||||||
|
Ox.Image('png/iceland.png', function(iceland) {
|
||||||
|
result(Ox.$('<img>').attr({src: iceland.src()}));
|
||||||
|
status(
|
||||||
|
'Encode the text <i>"' + text.iceland + '"</i> into '
|
||||||
|
+ 'the least significant bits of iceland.png'
|
||||||
|
);
|
||||||
|
iceland.encode(text.iceland, false, 1, function(iceland) {
|
||||||
|
result(Ox.$('<img>').attr({src: iceland.src()}));
|
||||||
|
status('Load vietnam.png');
|
||||||
|
Ox.Image('png/vietnam.png', function(vietnam) {
|
||||||
|
result(Ox.$('<img>').attr({src: vietnam.src()}));
|
||||||
|
status(
|
||||||
|
'Encode the text <i>"' + text.vietnam + '"</i> into'
|
||||||
|
+ ' the least significant bits of vietnam.png'
|
||||||
|
);
|
||||||
|
vietnam.encode(text.vietnam, false, 1, function(vietnam) {
|
||||||
|
result(Ox.$('<img>').attr({src: vietnam.src()}));
|
||||||
|
status(
|
||||||
|
'Encode vietnam.png into iceland.png '
|
||||||
|
+ 'by flipping the second least significant bits'
|
||||||
|
);
|
||||||
|
iceland.encode(vietnam.src(), -1, function(iceland) {
|
||||||
|
result(Ox.$('<img>').attr({src: iceland.src()}));
|
||||||
|
callback(iceland);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function decode(iceland) {
|
||||||
|
status('Decode the least signigicant bits of iceland.png');
|
||||||
|
iceland.decode(false, 1, function(str) {
|
||||||
|
result(str);
|
||||||
|
status('Decode all bits of iceland.png');
|
||||||
|
iceland.decode(-1, function(src) {
|
||||||
|
result(
|
||||||
|
Ox.sub(src, 0, 32) + '<i> ... ['
|
||||||
|
+ Ox.formatNumber(src.length - 64)
|
||||||
|
+ ' more bytes] ... </i>' + Ox.sub(src, -32)
|
||||||
|
);
|
||||||
|
status('Load as vietnam.png');
|
||||||
|
Ox.Image(src, function(image) {
|
||||||
|
result(Ox.$('<img>').attr({src: src}));
|
||||||
|
status('Decode the least significant bits of vietnam.png');
|
||||||
|
image.decode(false, 1, function(str) {
|
||||||
|
result(str);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function status(value) {
|
||||||
|
var $td = Ox.$('<td>');
|
||||||
|
if (Ox.isString(value)) {
|
||||||
|
$td.html(
|
||||||
|
value.replace(/(\w+\.png)/g, '<b>$1</b>')
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
$td.append(value);
|
||||||
|
}
|
||||||
|
$tr = Ox.$('<tr>').append($td).appendTo($table);
|
||||||
|
}
|
||||||
|
|
||||||
|
function result(value) {
|
||||||
|
var $td = Ox.$('<td>');
|
||||||
|
if (Ox.isString(value)) {
|
||||||
|
$td.html(value);
|
||||||
|
} else {
|
||||||
|
$td.append(value);
|
||||||
|
}
|
||||||
|
$tr.append($td)
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
BIN
examples/steganography/png/iceland.png
Normal file
BIN
examples/steganography/png/iceland.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 250 KiB |
BIN
examples/steganography/png/vietnam.png
Normal file
BIN
examples/steganography/png/vietnam.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 24 KiB |
Loading…
Reference in a new issue