gifken
How to use
Create a GIF image in browser
<div id="content"></div>
<script src="https://unpkg.com/gifken/gifken.js"></script>
<script type="application/javascript">
const gifken = require("gifken");
window.onload = () => {
var newgif = new gifken.Gif();
newgif.width = 100;
newgif.height = 100;
newgif.globalColorTable = gifken.GifColor.createColorTable([
new gifken.GifColor(0, 0, 0),
new gifken.GifColor(255, 0, 0),
new gifken.GifColor(0, 255, 0),
new gifken.GifColor(0, 0, 255),
new gifken.GifColor(100, 100, 255),
new gifken.GifColor(100, 255, 100),
new gifken.GifColor(255, 100, 100),
new gifken.GifColor(0, 255, 255),
new gifken.GifColor(255, 0, 255),
new gifken.GifColor(255, 255, 0),
new gifken.GifColor(255, 255, 255)
]);
newgif.frames = [gifken.GifFrame.init(newgif.width, newgif.height)];
for (var i = 0; i < newgif.frames[0].pixelData.length; ++i) {
newgif.frames[0].pixelData[i] = i % 11;
}
var newimg = new Image();
newimg.src = gifken.GifPresenter.writeToDataUrl(newgif.writeToArrayBuffer());
document.getElementById("content").appendChild(newimg);
};
</script>
Split an animated GIF image in browser
window.onload = function () {
var xhr = new XMLHttpRequest();
xhr.open("GET", GIF_IMAGE_URL, true);
xhr.responseType = "arraybuffer";
xhr.onload = function (e) {
var arrayBuffer = e.target["response"];
var gif = gifken.Gif.parse(arrayBuffer);
gif.split(true).forEach(function (i) {
var img = new Image();
var blob = gifken.Gif.writeToBlob(i.writeToArrayBuffer());
img.src = URL.createObjectURL(blob);
document.getElementById("content").appendChild(img);
});
};
xhr.send();
};
Create a GIF image by Node.js
npm install gifken
const gifken = require("gifken"),
fs = require("fs"),
path = require("path");
const newgif = new gifken.Gif();
newgif.width = 100;
newgif.height = 100;
newgif.globalColorTable = gifken.GifColor.createColorTable([
new gifken.GifColor(0, 0, 0),
new gifken.GifColor(255, 0, 0),
new gifken.GifColor(0, 255, 0),
new gifken.GifColor(0, 0, 255),
new gifken.GifColor(100, 100, 255),
new gifken.GifColor(100, 255, 100),
new gifken.GifColor(255, 100, 100),
new gifken.GifColor(0, 255, 255),
new gifken.GifColor(255, 0, 255),
new gifken.GifColor(255, 255, 0),
new gifken.GifColor(255, 255, 255)
]);
newgif.frames = [gifken.GifFrame.init(newgif.width, newgif.height)];
for (let i = 0; i < newgif.frames[0].pixelData.length; ++i) {
newgif.frames[0].pixelData[i] = i % 11;
}
const buffer = newgif.writeToArray();
fs.writeFile(
path.resolve(__dirname, "sample.gif"),
Buffer.from(buffer),
err => {
if (err) throw err;
console.log("It's saved!");
}
);
Directories
gifken
âââ build build results
âââ node_modules
âââ sample sample software using gifken
â  âââ chromeextension
â âââ node
âââ src source directory
âââ test
Build
To build gifken, following tools are required
git clone *thisrepo*
cd gifken
npm install
npm run-script build
License
MIT