hokein/index.html

## index.html
<!DOCTYPE html>
<html>
<head>
  <script src="main.js"></script>
</head>
<body>
  <p>Hello World!</p>
  <button id="showButton" >Click me</button>
<div id="screenshot"></div>
</body>
</html>

## main.js
window.requestFileSystem  = window.requestFileSystem || window.webkitRequestFileSystem;
var file_system;

function base64ToBinary(imgUrl) {
  var BASE64_MARKER = ';base64,';
  var base64Index = imgUrl.indexOf(BASE64_MARKER) + BASE64_MARKER.length;
  var base64 = imgUrl.substring(base64Index);
  var raw = window.atob(base64);
  var rawLength = raw.length;
  var array = new Uint8Array(new ArrayBuffer(rawLength));

  for (i = 0; i < rawLength; ++i) {
    array[i] = raw.charCodeAt(i);
  }
  return array;
}

function readImage(file_name) {
  file_system.root.getFile(file_name, {}, function(fileEntry){
    a = fileEntry;
    var div = document.getElementById("screenshot");
    div.innerHTML = '<img src="'+fileEntry.toURL()+ '">';
  }, function(){ console.log("Can not open " + file_name) });
};

function onInitFs(fs) {
  file_system = fs;
  chrome.tabs.captureVisibleTab({"format":"jpeg"}, function(imgUrl) {
    file_system.root.getFile("capture.jpeg", {create: true}, function(fileEntry) {
      fileEntry.createWriter(function(fileWriter) {
        fileWriter.onwriteend = function(e) {
          console.log("Write successfully")
        };
        fileWriter.onerror = function(e) {
          console.log("Write error!")
        };
        content = base64ToBinary(imgUrl);
        bob = new Blob([content]);
        fileWriter.write(bob);
      });
    });
  });
};

function init() {
  window.requestFileSystem(window.TEMPORARY, 5*1024*1024, onInitFs);
  document.getElementById("showButton").onclick = function() {readImage("capture.jpeg")};
}
document.addEventListener('DOMContentLoaded', init);

## manifest.json
{
  "manifest_version": 2,
  "name": "Write Image File to HTM5 Filesystem Sample",
  "version": "1",
  "permissions": [
    "tabs"
  ],
  "app": {
    "launch": {
      "local_path": "index.html"
    }
  }
}
	<!DOCTYPE html>
	<html>
	<head>
	<script src="main.js"></script>
	</head>
	<body>
	<p>Hello World!</p>
	<button id="showButton" >Click me</button>
	<div id="screenshot"></div>
	</body>
	</html>
	window.requestFileSystem = window.requestFileSystem \|\| window.webkitRequestFileSystem;
	var file_system;

	function base64ToBinary(imgUrl) {
	var BASE64_MARKER = ';base64,';
	var base64Index = imgUrl.indexOf(BASE64_MARKER) + BASE64_MARKER.length;
	var base64 = imgUrl.substring(base64Index);
	var raw = window.atob(base64);
	var rawLength = raw.length;
	var array = new Uint8Array(new ArrayBuffer(rawLength));

	for (i = 0; i < rawLength; ++i) {
	array[i] = raw.charCodeAt(i);
	}
	return array;
	}

	function readImage(file_name) {
	file_system.root.getFile(file_name, {}, function(fileEntry){
	a = fileEntry;
	var div = document.getElementById("screenshot");
	div.innerHTML = '<img src="'+fileEntry.toURL()+ '">';
	}, function(){ console.log("Can not open " + file_name) });
	};

	function onInitFs(fs) {
	file_system = fs;
	chrome.tabs.captureVisibleTab({"format":"jpeg"}, function(imgUrl) {
	file_system.root.getFile("capture.jpeg", {create: true}, function(fileEntry) {
	fileEntry.createWriter(function(fileWriter) {
	fileWriter.onwriteend = function(e) {
	console.log("Write successfully")
	};
	fileWriter.onerror = function(e) {
	console.log("Write error!")
	};
	content = base64ToBinary(imgUrl);
	bob = new Blob([content]);
	fileWriter.write(bob);
	});
	});
	});
	};

	function init() {
	window.requestFileSystem(window.TEMPORARY, 510241024, onInitFs);
	document.getElementById("showButton").onclick = function() {readImage("capture.jpeg")};
	}
	document.addEventListener('DOMContentLoaded', init);
	{
	"manifest_version": 2,
	"name": "Write Image File to HTM5 Filesystem Sample",
	"version": "1",
	"permissions": [
	"tabs"
	],
	"app": {
	"launch": {
	"local_path": "index.html"
	}
	}
	}