oxjs/demos/png/ox.png.js

125 lines
4.1 KiB
JavaScript
Raw Normal View History

2010-01-07 20:21:07 +00:00
Ox = Ox || {};
(function() {
Ox.PNG = function(url) {
var that = this,
self = {};
self.getCanvas = function() {
var canvas = $("<canvas/>")
.attr({
width: that.width,
height: that.height
})[0],
context = canvas.getContext("2d");
context.drawImage(self.$png[0], 0, 0);
return {
canvas: canvas,
context: context
};
};
self.getChunks = function() {
var data = self.getData().substr(8),
length, chunks = [];
while (data) {
length = data.charCodeAt(1) << 16 |
data.charCodeAt(2) << 8 |
data.charCodeAt(3);
chunks.push({
length: length,
type: data.substr(4, 4),
data: data.substr(8, length),
crc: data.substr(length + 8, 4)
});
data = data.substr(length + 12);
}
return chunks;
}
self.getData = function() {
return atob(self.getURL().split(",")[1]);
}
self.getDimensions = function() {
var dimensions;
self.$png
.hide()
.appendTo($("body"));
dimensions = {
width: self.$png.width(),
height: self.$png.height()
}
self.$png.remove();
return dimensions;
}
self.getHeader = function() {
return self.getData().substr(0, 8);
}
self.getURL = function() {
return that.canvas.toDataURL();
}
self.onLoad = function($png, callback) {
self.$png = $png;
var dimensions = self.getDimensions();
that.width = dimensions.width;
that.height = dimensions.height;
var canvas = self.getCanvas();
that.context = canvas.context;
that.canvas = canvas.canvas;
console.log(self.getChunks())
callback();
};
that.addChunk = function(options) {
options = $.extend({
data: "",
type: "",
position: -1
}, options);
var len = options.data.length,
randomType = !options.type,
chunks = self.getChunks();
chunk = {
length: 0,
type: options.type || "",
data: options.data,
crc: ""
},
data = "";
i;
// 0 1 2 3 4 ... length: 6
// IHDR IDAT IDAT IDAT ifOo IEND
options.position = options.position < 0 ?
Math.max(chunks.length - 1 - options.position, 0) :
Math.min(options.position, chunks.length - 2);
for (i = 0; i < 4; i++) {
if (randomType) {
// format abCd (ancillary, private, (reserved), safe-to-copy)
chunk.type += String.fromCharCode((i == 2 ? 65 : 97) + Math.random() * 26);
}
chunk.length += String.fromCharCode(len >> ((3 - i) * 8) & 255);
chunk.crc += String.fromCharCode(Math.random() * 256);
}
chunks.splice(position + 1, 0, chunk);
// data = ...
}
that.appendTo = function(selector) {
$("<img/>")
.attr({
src: self.getURL()
})
.appendTo(selector);
}
that.getSize = function() {
return self.getData().length;
}
that.load = function(callback) {
$("<img/>")
.attr({
src: url
})
.load(function() {
self.onLoad($(this), callback);
});
}
return that;
};
})();