Got basic IPFS file contents load and rendering working.

This commit is contained in:
Dan 2017-12-09 23:06:25 -08:00
parent 013f198b74
commit a79b73e112
4 changed files with 19 additions and 77 deletions

3
.gitignore vendored
View File

@ -1,3 +1,4 @@
dist
node_modules
npm-debug.log
dist
package-lock.json

View File

@ -1,31 +1,9 @@
<html>
<head>
<title>Sample App</title>
<title>IPFS JavaScript gateway</title>
<style type="text/css">body {margin: 0}</style>
</head>
<body>
<script>
// From https://github.com/LZMA-JS/LZMA-JS (lzma-d.js)
/*var e=function(){"use ...*/
// Data portion made with: webpack && cat dist/bundle.js | lzma | base64 -w 0
// IDEA: Load this from a CDN (unpkg.com?), and only resort to the local copy if the CDN copy doesn't load.
var compressed_javascript = "data:application/octet-stream;base64,XQAAgAD..."
document.body.insertAdjacentHTML('beforeend', new Date() + 'start<br />');
fetch(compressed_javascript).then(response => {
document.body.insertAdjacentHTML('beforeend', new Date() + 'decompressed<br />');
compressed_javascript = null
return response.arrayBuffer()
}).then(buffer => {
LZMA.decompress(new Uint8Array(buffer), function(result, error) {
document.body.insertAdjacentHTML('beforeend', new Date() + 'starting eval<br />');
buffer = null
eval(result)
})
})
// For conversion of this file to data URI, run: cat index.html | python -c "import urllib, sys; print urllib.quote(sys.stdin.read())"
// Then prepend with: "data:text/html;charset=utf-8,"
</script>
<script type="text/javascript" src="/dist/bundle.js"></script>
</body>
</html>

View File

@ -17,6 +17,6 @@
"webpack-dev-server": "^2.4.5"
},
"dependencies": {
"ipfs": "file:../../"
"ipfs": "0.27.1"
}
}

View File

@ -1,65 +1,28 @@
'use strict'
const IPFS = require('ipfs')
const Repo = require('ipfs-repo')
const LevelStore = require('datastore-level')
function MemoryLevelStore() {
return new LevelStore('/memory', {db: require('memdown')})
}
MemoryLevelStore.prototype = new LevelStore('/memory', {db: require('memdown')})
MemoryLevelStore.prototype.constructor = MemoryLevelStore
const stringToUse = 'Hello world from self-contained, self-hosted js-ipfs!!!'
function App() {
let node
create()
function create () {
// Create the IPFS node instance
function create() {
node = new IPFS()
var repo_name = String(Math.random() + Date.now())
var storage_backends = {
root: MemoryLevelStore,
blocks: MemoryLevelStore,
datastore: MemoryLevelStore,
}
node.on('ready', () => {
console.log('IPFS node is ready')
console.log('loading IPFS content for ' + window.location.pathname)
node = new IPFS({ repo: new Repo(repo_name, {storageBackends: storage_backends}) })
node.once('ready', () => {
console.log('IPFS node is ready')
ops()
})
}
function ops () {
node.id((err, res) => {
if (err) {
throw err
}
document.body.insertAdjacentHTML('beforeend',
"<h1>Everything is working!</h1>" +
"<p>Your ID is <strong>" + res.id + "</strong></p>" +
"<p>Your IPFS version is <strong>" + res.agentVersion + "</strong></p>" +
"<p>Your IPFS protocol version is <strong>" + res.protocolVersion + "</strong></p>"
)
})
node.files.add([Buffer.from(stringToUse)], (err, filesAdded) => {
if (err) { console.log("ERROR"); throw err }
const hash = filesAdded[0].hash
document.body.insertAdjacentHTML('beforeend', "<hr /><div>Added a file!<br /><a href=\"https://gateway.ipfs.io/ipfs/" + hash + "\">" + hash + "</a></div>")
node.files.cat(hash, (err, data) => {
if (err) { console.log("ERROR 2"); throw err }
document.body.insertAdjacentHTML('beforeend', "<p>Contents of this file: <br />" + data + "</p>")
// Load the page contents for the IPFS hash.
node.files.cat(window.location.pathname, (err, file) => {
if (err) { throw err }
var iframe = document.createElement('iframe')
iframe.style = 'width: 100%; height: 100%; border: 0; overflow: hidden'
iframe.src = URL.createObjectURL(new Blob([file]))
document.body.appendChild(iframe)
})
})
})
}
}