index.html

<!DOCTYPE html>
<!-- cfb.js (C) 2013-present  SheetJS http://sheetjs.com -->
<!-- vim: set ts=2: -->
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>JS-CFB Live Demo</title>
<style>
#drop{
	border:2px dashed #bbb;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	padding:25px;
	text-align:center;
	font:20pt bold,"Vollkorn";color:#bbb
}
#b64data{
	width:100%;
}
a { text-decoration: none }
</style>
</head>
<body>
<pre>
<b><a href="http://sheetjs.com">SheetJS CFB Preview Live Demo</a></b>

<a href="https://github.com/SheetJS/js-cfb">Source Code Repo</a>
<a href="https://github.com/SheetJS/js-cfb/issues">Issues?  Something look weird?  Click here and report an issue</a>
<div id="drop">Drop an XLS file here to see the CFB structure.</div>

<b>Advanced Demo Options:</b>
Use readAsBinaryString: (when available) <input type="checkbox" name="userabs" checked>

<b>Export Current File</b>
- <a id="savecfb" onclick="savefile('cfb');" href="#">Export data as CFB</a> (Container File Binary Format)
- <a id="savezip" onclick="savefile('zip');" href="#">Export data as ZIP</a>
- <a id="savemad" onclick="savefile('mad');" href="#">Export data as MAD</a> (MIME aggregate document)
</pre>
<pre id="out"></pre>
<br />
<script src="shim.js"></script>
<script src="https://unpkg.com/printj/dist/printj.min.js"></script>
<script src="dist/cfb.min.js"></script>
<script>
/*jshint browser:true */
/* eslint-env browser */
/*global Uint8Array, ArrayBuffer */
/*global CFB, out, PRINTJ  */
/* exported savefile, download_file */
/* eslint no-use-before-define:0 */
var global_cfb;

if(!String.prototype.repeat) String.prototype.repeat = function(count) {
  var o = "";
  for(var i = 0; i < count; ++i) o += this;
  return o;
};

var get_manifest = (function() {
	var sprintf = PRINTJ.sprintf;
	function fix_string(x/*:string*/)/*:string*/ { return x.replace(/[\u0000-\u001f]/, function($$) { return sprintf("\\u%04X", $$.charCodeAt(0)); }); }
	var format_date = function(date/*:Date*/)/*:string*/ {
		return sprintf("%02u-%02u-%02u %02u:%02u", date.getUTCMonth()+1, date.getUTCDate(), date.getUTCFullYear()%100, date.getUTCHours(), date.getUTCMinutes());
	};
	return function get_manifest(cfb) {
		var out = [];
		var rlen = cfb.FullPaths[0].length;

		var basetime = new Date(1980,0,1);
		var cnt = 0, rootsize = 0, filesize = 0;
		out.push("  Length     Date   Time    Name");
		out.push(" --------    ----   ----    ----");
		cfb.FileIndex.forEach(function(file/*:CFBEntry*/, i/*:number*/) {
			switch(file.type) {
				case 5:
					basetime = file.ct || file.mt || basetime;
					rootsize = file.size;
					break;
				case 2:
					var fixname = fix_string(cfb.FullPaths[i]);
					if(fixname.match(/\\u0001Sh33tJ5/)) return;
					fixname = fixname.slice(rlen);
					out.push(sprintf("%9lu  %s   <a href=\"#\" onclick=\"download_file(%d);\">%s</a>", file.size, format_date(basetime), i, fixname));
					filesize += file.size;
					++cnt;
			}
		});
		out.push(" --------                   -------");
		out.push(sprintf("%9lu                   %lu file%s", rootsize || filesize, cnt, (cnt !== 1 ? "s" : "")));
		return out.join("\n");
	};
})();

function process_data(cfb) {
	global_cfb = cfb;
	var output = get_manifest(cfb);
	out.innerHTML = output;
}

var do_file = (function() {
	var rABS = typeof FileReader !== "undefined" && (FileReader.prototype||{}).readAsBinaryString;
	var domrabs = document.getElementsByName("userabs")[0];
	if(!rABS) domrabs.disabled = !(domrabs.checked = false);

	return function do_file(files) {
		rABS = domrabs.checked;
		var f = files[0];
		var reader = new FileReader();
		reader.onload = function(e) {
			var data = e.target.result;
			var cfb = CFB.read(rABS ? data : new Uint8Array(data), {type: rABS ? 'binary' : 'buffer'});
			process_data(cfb);
		};
		if(rABS) reader.readAsBinaryString(f);
		else reader.readAsArrayBuffer(f);
	};
})();

(function() {
	var drop = document.getElementById('drop');
	if(!drop.addEventListener) return;

	function handleDrop(e) {
		e.stopPropagation();
		e.preventDefault();
		do_file(e.dataTransfer.files);
	}

	function handleDragover(e) {
		e.stopPropagation();
		e.preventDefault();
		e.dataTransfer.dropEffect = 'copy';
	}

	drop.addEventListener('dragenter', handleDragover, false);
	drop.addEventListener('dragover', handleDragover, false);
	drop.addEventListener('drop', handleDrop, false);
})();

function saveAs(blob, fname) {
	var url = URL.createObjectURL(blob);
	var a = document.createElement("a");
	a.download = fname; a.href = url; document.body.appendChild(a); a.click();
	/*:: if(document.body == null) throw new Error("unreachable"); */ document.body.removeChild(a);
	if(URL.revokeObjectURL && typeof setTimeout !== 'undefined') setTimeout(function() { URL.revokeObjectURL(url); }, 60000);
}

var savefile = (function() {
	var s2ab = function s2ab(s) {
		var buf, i=0;
		if(typeof ArrayBuffer !== 'undefined') {
			buf = new ArrayBuffer(s.length);
			var view = new Uint8Array(buf);
			for (; i!=s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
			return buf;
		} else {
			buf = new Array(s.length);
			for (; i!=s.length; ++i) buf[i] = s.charCodeAt(i) & 0xFF;
			return buf;
		}
	};

	return function savefile(type) {
		if(!global_cfb) return alert("Must load a file first!");
		if(typeof console !== 'undefined') console.log(global_cfb);
		var data = CFB.write(global_cfb, {type:'binary', fileType: type});
		if(typeof console !== 'undefined') console.log(data);
		var newcfb = CFB.read(data, {type:'binary'});
		console.log(newcfb);

		var fname = "SheetJSCFBDemo." + type;
		var blob = new Blob([s2ab(data)],{type:"application/octet-stream"});
		if(typeof navigator !== 'undefined' && navigator.msSaveBlob) return navigator.msSaveBlob(blob, fname);
		saveAs(blob, fname);
	};
})();

var download_file = (function() {
	var a2ab = function a2ab(a) {
		var o = new ArrayBuffer(a.length);
		var view = new Uint8Array(o);
		for (var i = 0; i!=a.length; ++i) view[i] = a[i];
		return o;
	};

	return function download_file(i) {
		if(!global_cfb) return alert("Must load a file first!");
		if(typeof console !== 'undefined') console.log(global_cfb);
		var file = global_cfb.FileIndex[i], data = file.content;
		var blob = new Blob([a2ab(data)],{type:"application/octet-stream"});
		if(typeof navigator !== 'undefined' && navigator.msSaveBlob) return navigator.msSaveBlob(blob, file.name);
		saveAs(blob, file.name);
	};
})();
	var _gaq = _gaq || [];
	_gaq.push(['_setAccount', 'UA-36810333-1']);
	_gaq.push(['_trackPageview']);

	(function() {
		var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
		ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
		var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
	})();
</script>
</body>
</html>