nolanlawson/index.html

## index.html
<html>
<body>
<pre id="display"></pre>
<script src="//cdn.jsdelivr.net/pouchdb/3.1/pouchdb.js"></script>
<script>
(function () {
  'use strict';

  var display = document.getElementById('display');
  display.innerHTML = (display.innerHTML || '');
  function log(text) {
    display.innerHTML += "\n" + text;
  }
  var base64 = 'iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAB1klEQVR42n2TzytEURTHv3e8N1joRhZGzJsoCjsLhcw0jClKWbHwY2GnLGUlIfIP2IjyY2djZTHSMJNQSilFNkz24z0/Ms2MrnvfvMu8mcfZvPvuPfdzz/mecwgKLNYKb0cFEgXbRvwV2s2HuWazCbzKA5LvNecDXayBjv9NL7tEpSNgbYzQ5kZmAlSXgsGGXmS+MjhKxDHgC+quyaPKQtoPYMQPOh5U9H6tBxF+Icy/aolqAqLP5wjWd5r/Ip3YXVILrF4ZRYAxDhCOJ/yCwiMI+/xgjOEzmzIhAio04GeGayIXjQ0wGoAuQ5cmIjh8jNo0GF78QwNhpyvV1O9tdxSSR6PLl51FnIK3uQ4JJQME4sCxCIRxQbMwPNSjqaobsfskm9l4Ky6jvCzWEnDKU1ayQPe5BbN64vYJ2vwO7CIeLIi3ciYAoby0M4oNYBrXgdgAbC/MhGCRhyhCZwrcEz1Ib3KKO7f+2I4iFvoVmIxHigGiZHhPIb0bL1bQApFS9U/AC0ulSXrrhMotka/lQy0Ic08FDeIiAmDvA2HX01W05TopS2j2/H4T6FBVbj4YgV5+AecyLk+CtvmsQWK8WZZ+Hdf7QGu7fobMuZHyq1DoJLvUqQrfM966EU/qYGwAAAAASUVORK5CYII=';

  var doc = {
    _id: 'docid',
    _attachments: {
      'mario.png': {
        data: base64,
        content_type: 'image/png'
      }
    }
  };

  var db = new PouchDB('db');
  db.put(doc).catch(function (err) {
    if (err.status !== 409) { // already stored
      throw err;
    }
  }).then(function () {
    return db.getAttachment('docid', 'mario.png');
  }).then(function (blob) {
    var url = URL.createObjectURL(blob);
    log('Stored a png blob of size: ' + blob.size);
    log('Inserting an img...');
    var img = document.createElement('img');
    img.src = url;
    document.body.appendChild(img);
  }).catch(function (err) {
    console.log("unexpected error");
    console.log(err);
  });

})();
</script>
</body>
</html>
	<html>
	<body>
	<pre id="display"></pre>
	<script src="//cdn.jsdelivr.net/pouchdb/3.1/pouchdb.js"></script>
	<script>
	(function () {
	'use strict';

	var display = document.getElementById('display');
	display.innerHTML = (display.innerHTML \|\| '');
	function log(text) {
	display.innerHTML += "\n" + text;
	}
	var base64 = 'iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAB1klEQVR42n2TzytEURTHv3e8N1joRhZGzJsoCjsLhcw0jClKWbHwY2GnLGUlIfIP2IjyY2djZTHSMJNQSilFNkz24z0/Ms2MrnvfvMu8mcfZvPvuPfdzz/mecwgKLNYKb0cFEgXbRvwV2s2HuWazCbzKA5LvNecDXayBjv9NL7tEpSNgbYzQ5kZmAlSXgsGGXmS+MjhKxDHgC+quyaPKQtoPYMQPOh5U9H6tBxF+Icy/aolqAqLP5wjWd5r/Ip3YXVILrF4ZRYAxDhCOJ/yCwiMI+/xgjOEzmzIhAio04GeGayIXjQ0wGoAuQ5cmIjh8jNo0GF78QwNhpyvV1O9tdxSSR6PLl51FnIK3uQ4JJQME4sCxCIRxQbMwPNSjqaobsfskm9l4Ky6jvCzWEnDKU1ayQPe5BbN64vYJ2vwO7CIeLIi3ciYAoby0M4oNYBrXgdgAbC/MhGCRhyhCZwrcEz1Ib3KKO7f+2I4iFvoVmIxHigGiZHhPIb0bL1bQApFS9U/AC0ulSXrrhMotka/lQy0Ic08FDeIiAmDvA2HX01W05TopS2j2/H4T6FBVbj4YgV5+AecyLk+CtvmsQWK8WZZ+Hdf7QGu7fobMuZHyq1DoJLvUqQrfM966EU/qYGwAAAAASUVORK5CYII=';

	var doc = {
	_id: 'docid',
	_attachments: {
	'mario.png': {
	data: base64,
	content_type: 'image/png'
	}
	}
	};

	var db = new PouchDB('db');
	db.put(doc).catch(function (err) {
	if (err.status !== 409) { // already stored
	throw err;
	}
	}).then(function () {
	return db.getAttachment('docid', 'mario.png');
	}).then(function (blob) {
	var url = URL.createObjectURL(blob);
	log('Stored a png blob of size: ' + blob.size);
	log('Inserting an img...');
	var img = document.createElement('img');
	img.src = url;
	document.body.appendChild(img);
	}).catch(function (err) {
	console.log("unexpected error");
	console.log(err);
	});

	})();
	</script>
	</body>
	</html>