64 lines
2.6 KiB
HTML
64 lines
2.6 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<title>OxJS Image Encode Demo</title
|
||
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||
|
|
<script type="text/javascript" src="../../build/Ox.js"></script>
|
||
|
|
<script>
|
||
|
|
Ox.load('Image', function() {
|
||
|
|
var fixmeOxelement;
|
||
|
|
var body = Ox.element('body'),
|
||
|
|
button = Ox.element('<input>').attr({type: 'button', value: 'encode'}).click(function() {
|
||
|
|
button.attr({disabled: 'disabled'})
|
||
|
|
if (button.attr('value') == 'encode') {
|
||
|
|
button.attr({value: 'encoding...'});
|
||
|
|
encode(function(image) {
|
||
|
|
fixmeOxelement = image;
|
||
|
|
button.removeAttr('disabled').attr({value: 'decode'});
|
||
|
|
});
|
||
|
|
} else {
|
||
|
|
button.attr({value: 'decoding...'});
|
||
|
|
decode(fixmeOxelement, function() {
|
||
|
|
button.attr({value: 'done'})
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}).appendTo(body);
|
||
|
|
Ox.element('<br>').appendTo(body);
|
||
|
|
function encode(callback) {
|
||
|
|
var lines = [
|
||
|
|
'The first image he told me about was of three children on a road in Iceland in 1965.',
|
||
|
|
'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.'
|
||
|
|
];
|
||
|
|
Ox.Image('png/vietnam.png', function(vietnam) {
|
||
|
|
vietnam.encode(lines[1], false, 1, function(vietnam) {
|
||
|
|
Ox.Image('png/iceland.png', function(iceland){
|
||
|
|
iceland.encode(lines[0], false, 1, function(iceland) {
|
||
|
|
Ox.print('src.length', vietnam.src().length)
|
||
|
|
iceland.encode(vietnam.src(), -1, function(image) {
|
||
|
|
Ox.element('<img>').attr({src: image.src()}).appendTo(body);
|
||
|
|
callback(image);
|
||
|
|
});
|
||
|
|
});
|
||
|
|
});
|
||
|
|
});
|
||
|
|
});
|
||
|
|
}
|
||
|
|
function decode(iceland, callback) {
|
||
|
|
iceland.decode(false, 1, function(str) {
|
||
|
|
Ox.element('<div>').html(str).appendTo(body);
|
||
|
|
iceland.decode(-1, function(src) {
|
||
|
|
Ox.element('<img>').attr({src: src}).appendTo(body);
|
||
|
|
Ox.Image(src, function(vietnam) {
|
||
|
|
vietnam.decode(false, 1, function(str) {
|
||
|
|
Ox.element('<div>').html(str).appendTo(body);
|
||
|
|
callback();
|
||
|
|
});
|
||
|
|
});
|
||
|
|
});
|
||
|
|
});
|
||
|
|
}
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
</head>
|
||
|
|
<body></body>
|
||
|
|
</html>
|