embarklabs/embark
2
0
Fork 0
mirror of https://github.com/embarklabs/embark.git synced 2025-02-04 09:54:42 +00:00
Code Issues Projects Releases Wiki Activity

Add IPNS demo

Browse Source
This commit is contained in:
Anthony Laibe 2018-07-30 12:49:03 +01:00 committed by Iuri Matias
parent 508b37163e
commit d6849bf04f
7 changed files with 6595 additions and 2652 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
lib/modules/ens/embarkjs.js
View File

@ -250,4 +250,4 @@ __embarkENS.isAvailable = function () {
__embarkENS.register = function () { __embarkENS.register = function () {
return new Error("Not available with ENS"); return new Error("Not available with ENS");
} };

26
lib/modules/ipfs/embarkjs/name.js
View File

@ -1,9 +1,13 @@
/*global __embarkIPFS*/ /*global __embarkIPFS*/
const NoConnectionError = 'No IPFS connection. Please ensure to call Embark.Names.setProvider()';
const NotAvailableError = 'Not available with ipns';
__embarkIPFS.resolve = function (name, callback) { __embarkIPFS.resolve = function (name, callback) {
callback = callback || function () {}; callback = callback || function () {};
if (!this._ipfsConnection) { if (!this._ipfsConnection) {
var connectionError = new Error('No IPFS connection. Please ensure to call Embark.Names.setProvider()'); var connectionError = new Error(NoConnectionError);
return callback(connectionError); return callback(connectionError);
} }
@ -12,18 +16,28 @@ __embarkIPFS.resolve = function (name, callback) {
callback(null, res.Path); callback(null, res.Path);
}) })
.catch(() => { .catch(() => {
return callback(name + " is not registered"); callback(name + " is not registered");
}); });
}; };
__embarkIPFS.register = function(addr, options) { __embarkIPFS.register = function(addr, callback) {
if (!this._ipfsConnection) { if (!this._ipfsConnection) {
return new Error('No IPFS connection. Please ensure to call Embark.Names.setProvider()'); return new Error(NoConnectionError);
} }
return this._ipfsConnection.name.publish("/ipfs/" + addr, options); this._ipfsConnection.name.publish("/ipfs/" + addr)
.then(res => {
callback(null, res.Name);
})
.catch(() => {
callback(addr + " could not be registered");
});
}; };
__embarkIPFS.lookup = function () { __embarkIPFS.lookup = function () {
return new Error("Not Implemented"); return new Error(NotAvailableError);
};
__embarkIPFS.registerSubDomain = function () {
return new Error(NotAvailableError);
}; };

11
lib/modules/ipfs/index.js
View File

@ -162,13 +162,18 @@ class IPFS {
} }
isIpnsEnabledInTheConfig() { isIpnsEnabledInTheConfig() {
let {enabled, available_providers, provider} = this.namesystemConfig; let {enabled, available_providers} = this.namesystemConfig;
return enabled && available_providers.indexOf('ipns') > 0 && provider === 'ipns'; return enabled && available_providers.indexOf('ipns') > 0;
} }
setNamesystemProvider() { setNamesystemProvider() {
let code = `\nEmbarkJS.Names.setProvider('ipns', ${JSON.stringify(this.storageConfig.dappConnection[0] || {})});`; let code = `\nEmbarkJS.Names.setProvider('ipns', ${JSON.stringify(this.storageConfig.dappConnection[0] || {})});`;
this.embark.addProviderInit('names', code, this.isIpnsEnabledInTheConfig.bind(this));
let shouldInit = (namesystemConfig) => {
return (namesystemConfig.provider === 'ipns' && namesystemConfig.enabled === true);
};
this.embark.addProviderInit('names', code, shouldInit);
} }

8799
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

10
package.json
View File

@ -21,10 +21,10 @@
"url": "https://github.com/embark-framework/embark.git" "url": "https://github.com/embark-framework/embark.git"
}, },
"dependencies": { "dependencies": {
"@babel/core": "^7.0.0-beta.54", "@babel/core": "7.0.0-beta.54",
"@babel/plugin-transform-runtime": "^7.0.0-beta.54", "@babel/plugin-transform-runtime": "7.0.0-beta.54",
"@babel/preset-env": "^7.0.0-beta.54", "@babel/preset-env": "7.0.0-beta.54",
"@babel/preset-react": "^7.0.0-beta.54", "@babel/preset-react": "7.0.0-beta.54",
"@babel/runtime": "^7.0.0-beta.54", "@babel/runtime": "^7.0.0-beta.54",
"ascii-table": "0.0.9", "ascii-table": "0.0.9",
"async": "^2.0.1", "async": "^2.0.1",
@ -39,7 +39,7 @@
"decompress": "^4.2.0", "decompress": "^4.2.0",
"deep-equal": "^1.0.1", "deep-equal": "^1.0.1",
"ejs": "^2.5.8", "ejs": "^2.5.8",
"embarkjs": "^0.3.0", "embarkjs": "file:../EmbarkJS",
"eth-ens-namehash": "^2.0.8", "eth-ens-namehash": "^2.0.8",
"eth-lib": "^0.2.8", "eth-lib": "^0.2.8",
"ethereumjs-wallet": "0.6.0", "ethereumjs-wallet": "0.6.0",

363
templates/demo/app/components/storage.js
View File

@ -1,172 +1,241 @@
import EmbarkJS from 'Embark/EmbarkJS'; import EmbarkJS from 'Embark/EmbarkJS';
import React from 'react'; import React from 'react';
import { Alert, Form, FormGroup, FormControl, HelpBlock, Button } from 'react-bootstrap'; import {Alert, Form, FormGroup, FormControl, HelpBlock, Button} from 'react-bootstrap';
class Storage extends React.Component { class Storage extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
textToSave: 'hello world!', textToSave: 'hello world!',
generatedHash: '', generatedHash: '',
loadText: '', loadText: '',
storedText: '', storedText: '',
fileToUpload: null, fileToUpload: null,
fileHash: '', fileHash: '',
imageToDownload: '', imageToDownload: '',
url: '', url: '',
logs: [], logs: [],
storageError: '',
ipfsHash: '',
ipnsResolveName: '',
};
}
handleChange(e, name) {
this.state[name] = e.target.value;
this.setState(this.state);
}
handleFileUpload(e) {
this.setState({fileToUpload: [e.target]});
}
addToLog(txt) {
this.state.logs.push(txt);
this.setState({logs: this.state.logs});
}
setText(e) {
e.preventDefault();
EmbarkJS.Storage.saveText(this.state.textToSave)
.then((hash) => {
this.setState({
generatedHash: hash,
loadText: hash,
storageError: '' storageError: ''
}; });
} this.addToLog("EmbarkJS.Storage.saveText('" + this.state.textToSave + "').then(function(hash) { })");
})
.catch((err) => {
if (err) {
this.setState({storageError: err.message});
console.log("Storage saveText Error => " + err.message);
}
});
}
handleChange(e, name){ loadHash(e) {
this.state[name] = e.target.value; e.preventDefault();
this.setState(this.state);
}
handleFileUpload(e){ EmbarkJS.Storage.get(this.state.loadText)
this.setState({ fileToUpload: [e.target] }); .then((content) => {
} this.setState({storedText: content, storageError: ''});
this.addToLog("EmbarkJS.Storage.get('" + this.state.loadText + "').then(function(content) { })");
})
.catch((err) => {
if (err) {
this.setState({storageError: err.message});
console.log("Storage get Error => " + err.message);
}
});
}
addToLog(txt){ uploadFile(e) {
this.state.logs.push(txt); e.preventDefault();
this.setState({logs: this.state.logs});
}
setText(e){ EmbarkJS.Storage.uploadFile(this.state.fileToUpload)
e.preventDefault(); .then((hash) => {
this.setState({
fileHash: hash,
imageToDownload: hash,
storageError: ''
});
this.addToLog("EmbarkJS.Storage.uploadFile(this.state.fileToUpload).then(function(hash) { })");
})
.catch((err) => {
if (err) {
this.setState({storageError: err.message});
console.log("Storage uploadFile Error => " + err.message);
}
});
}
EmbarkJS.Storage.saveText(this.state.textToSave) loadFile(e) {
.then((hash) => { let _url = EmbarkJS.Storage.getUrl(this.state.imageToDownload);
this.setState({ this.setState({url: _url});
generatedHash: hash, this.addToLog("EmbarkJS.Storage.getUrl('" + this.state.imageToDownload + "')");
loadText: hash, }
storageError: ''
});
this.addToLog("EmbarkJS.Storage.saveText('" + this.state.textToSave + "').then(function(hash) { })");
})
.catch((err) => {
if(err){
this.setState({storageError: err.message});
console.log("Storage saveText Error => " + err.message);
}
});
}
loadHash(e){ ipnsRegister(e) {
e.preventDefault(); e.preventDefault();
this.setState({ ipnsRegistering: true });
EmbarkJS.Names.register(this.state.ipfsHash, (err, name) => {
if (err) {
console.log("Name Register Error => " + err.message);
}
EmbarkJS.Storage.get(this.state.loadText) this.setState({
.then((content) => { ipnsResolveName: name,
this.setState({storedText: content, storageError: ''}); ipnsName: name,
this.addToLog("EmbarkJS.Storage.get('" + this.state.loadText + "').then(function(content) { })"); ipnsRegistering: false
}) });
.catch((err) => { this.addToLog("EmbarkJS.Names.register(this.state.ipfsHash).then(function(hash) { })");
if(err){ });
this.setState({storageError: err.message}) }
console.log("Storage get Error => " + err.message);
}
});
}
uploadFile(e){ ipnsResolve(e) {
e.preventDefault(); e.preventDefault();
this.setState({ ipnsResolving: true });
EmbarkJS.Names.resolve(this.state.ipnsName, (err, path) => {
if (err) {
console.log("Name Resolve Error => " + err.message);
}
EmbarkJS.Storage.uploadFile(this.state.fileToUpload) this.setState({
.then((hash) => { ipfsPath: path,
this.setState({ ipnsResolving: false
fileHash: hash, });
imageToDownload: hash, this.addToLog("EmbarkJS.Names.resolve(this.state.ipnsName, function(err, path) { })");
storageError: '' });
}); }
this.addToLog("EmbarkJS.Storage.uploadFile(this.state.fileToUpload).then(function(hash) { })");
})
.catch((err) => {
if(err){
this.setState({storageError: err.message});
console.log("Storage uploadFile Error => " + err.message);
}
});
}
loadFile(e){ render() {
let _url = EmbarkJS.Storage.getUrl(this.state.imageToDownload); return <React.Fragment>
this.setState({url: _url}) {
this.addToLog("EmbarkJS.Storage.getUrl('" + this.state.imageToDownload + "')"); !this.props.enabled ?
} <React.Fragment>
<Alert bsStyle="warning">The node you are using does not support IPFS. Please ensure <a
href="https://github.com/ipfs/js-ipfs-api#cors" target="_blank">CORS</a> is setup for the IPFS
node.</Alert>
</React.Fragment> : ''
}
{
this.state.storageError !== '' ?
<Alert bsStyle="danger">{this.state.storageError}</Alert>
: ''
}
<h3>Save text to storage</h3>
<Form inline>
<FormGroup>
<FormControl
type="text"
defaultValue={this.state.textToSave}
onChange={e => this.handleChange(e, 'textToSave')}/>
<Button bsStyle="primary" onClick={(e) => this.setText(e)}>Save Text</Button>
<HelpBlock>generated Hash: <span className="textHash">{this.state.generatedHash}</span></HelpBlock>
</FormGroup>
</Form>
render(){ <h3>Load text from storage given an hash</h3>
return <React.Fragment> <Form inline>
{ <FormGroup>
!this.props.enabled ? <FormControl
<React.Fragment> type="text"
<Alert bsStyle="warning">The node you are using does not support IPFS. Please ensure <a href="https://github.com/ipfs/js-ipfs-api#cors" target="_blank">CORS</a> is setup for the IPFS node.</Alert> value={this.state.loadText}
</React.Fragment> : '' onChange={e => this.handleChange(e, 'loadText')}/>
} <Button bsStyle="primary" onClick={(e) => this.loadHash(e)}>Load</Button>
{ <HelpBlock>result: <span className="textHash">{this.state.storedText}</span></HelpBlock>
this.state.storageError !== '' ? </FormGroup>
<Alert bsStyle="danger">{this.state.storageError}</Alert> </Form>
: ''
}
<h3>Save text to storage</h3>
<Form inline>
<FormGroup>
<FormControl
type="text"
defaultValue={this.state.textToSave}
onChange={e => this.handleChange(e, 'textToSave')} />
<Button bsStyle="primary" onClick={(e) => this.setText(e)}>Save Text</Button>
<HelpBlock>generated Hash: <span className="textHash">{this.state.generatedHash}</span></HelpBlock>
</FormGroup>
</Form>
<h3>Load text from storage given an hash</h3> <h3>Upload file to storage</h3>
<Form inline> <Form inline>
<FormGroup> <FormGroup>
<FormControl <FormControl
type="text" type="file"
value={this.state.loadText} onChange={(e) => this.handleFileUpload(e)}/>
onChange={e => this.handleChange(e, 'loadText')} /> <Button bsStyle="primary" onClick={(e) => this.uploadFile(e)}>Upload</Button>
<Button bsStyle="primary" onClick={(e) => this.loadHash(e)}>Load</Button> <HelpBlock>generated hash: <span className="fileHash">{this.state.fileHash}</span></HelpBlock>
<HelpBlock>result: <span className="textHash">{this.state.storedText}</span></HelpBlock> </FormGroup>
</FormGroup> </Form>
</Form>
<h3>Upload file to storage</h3> <h3>Get file or image from storage</h3>
<Form inline> <Form inline>
<FormGroup> <FormGroup>
<FormControl <FormControl
type="file" type="text"
onChange={(e) => this.handleFileUpload(e)} /> value={this.state.imageToDownload}
<Button bsStyle="primary" onClick={(e) => this.uploadFile(e)}>Upload</Button> onChange={e => this.handleChange(e, 'imageToDownload')}/>
<HelpBlock>generated hash: <span className="fileHash">{this.state.fileHash}</span></HelpBlock> <Button bsStyle="primary" onClick={(e) => this.loadFile(e)}>Download</Button>
</FormGroup> <HelpBlock>file available at: <span><a href={this.state.url}
</Form> target="_blank">{this.state.url}</a></span></HelpBlock>
<HelpBlock><img src={this.state.url}/></HelpBlock>
</FormGroup>
</Form>
<h3>Get file or image from storage</h3> <h3>Register to IPNS</h3>
<Form inline> <Form inline>
<FormGroup> <FormGroup>
<FormControl <FormControl
type="text" type="text"
value={this.state.imageToDownload} value={this.state.ipfsHash}
onChange={e => this.handleChange(e, 'imageToDownload')} /> onChange={e => this.handleChange(e, 'ipfsHash')}/>
<Button bsStyle="primary" onClick={(e) => this.loadFile(e)}>Download</Button> <Button bsStyle="primary" onClick={(e) => this.ipnsRegister(e)}>
<HelpBlock>file available at: <span><a href={this.state.url} target="_blank">{this.state.url}</a></span></HelpBlock> {this.state.ipnsRegistering ? 'Registering...' : 'Register' }
<HelpBlock><img src={this.state.url} /></HelpBlock> </Button>
</FormGroup> <HelpBlock>It will take around 1 minute</HelpBlock>
</Form> <HelpBlock>registered at: <span>{this.state.ipnsName}</span></HelpBlock>
</FormGroup>
</Form>
<p>Javascript calls being made: </p> <h3>Resolve name</h3>
<div className="logs"> <Form inline>
<p>EmbarkJS.Storage.setProvider('ipfs',{'{'}server: 'localhost', port: '5001'{'}'})</p> <FormGroup>
{ <FormControl
this.state.logs.map((item, i) => <p key={i}>{item}</p>) type="text"
} value={this.state.ipnsResolveName}
</div> onChange={e => this.handleChange(e, 'ipnsResolveName')}/>
</React.Fragment>; <Button bsStyle="primary" onClick={(e) => this.ipnsResolve(e)}>
} {this.state.ipnsResolving ? 'Resolving...' : 'Resolve' }
</Button>
<HelpBlock>It will take around 1 minute</HelpBlock>
<HelpBlock>IPFS path: <span>{this.state.ipfsPath}</span></HelpBlock>
</FormGroup>
</Form>
<p>Javascript calls being made: </p>
<div className="logs">
<p>EmbarkJS.Storage.setProvider('ipfs',{'{'}server: 'localhost', port: '5001'{'}'})</p>
{
this.state.logs.map((item, i) => <p key={i}>{item}</p>)
}
</div>
</React.Fragment>;
}
} }
export default Storage; export default Storage;

24
templates/demo/app/dapp.js
View File

@ -15,10 +15,13 @@ class App extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.handleSelect = this.handleSelect.bind(this);
this.state = { this.state = {
activeKey: 1,
whisperEnabled: false, whisperEnabled: false,
storageEnabled: false, storageEnabled: false,
ensEnabled: false ensEnabled: false,
}; };
} }
@ -41,15 +44,15 @@ class App extends React.Component {
}); });
} }
} }
// EmbarkJS.Names.setProvider('ipns',{server: 'localhost', port: '5001'});
this.setState({ this.setState({
storageEnabled: true, storageEnabled: EmbarkJS.Storage.isAvailable(),
ensEnabled: EmbarkJS.Names.isAvailable() ensEnabled: EmbarkJS.Names.isAvailable(),
ensNameSystems: EmbarkJS.Names.currentNameSystems
}); });
}); });
} }
_renderStatus(title, available) { _renderStatus(title, available) {
let className = available ? 'pull-right status-online' : 'pull-right status-offline'; let className = available ? 'pull-right status-online' : 'pull-right status-offline';
return <React.Fragment> return <React.Fragment>
@ -58,9 +61,18 @@ class App extends React.Component {
</React.Fragment>; </React.Fragment>;
} }
handleSelect(key) {
if (key == 2) {
EmbarkJS.Names.setProvider('ipns', {server: 'localhost', port: '5001'});
} else if (key == 4) {
EmbarkJS.Names.currentNameSystems = this.state.ensNameSystems
}
this.setState({ activeKey: key });
}
render() { render() {
return (<div><h3>Embark - Usage Example</h3> return (<div><h3>Embark - Usage Example</h3>
<Tabs defaultActiveKey={1} id="uncontrolled-tab-example"> <Tabs onSelect={this.handleSelect} activeKey={this.state.activeKey} id="uncontrolled-tab-example">
<Tab eventKey={1} title="Blockchain"> <Tab eventKey={1} title="Blockchain">
<Blockchain/> <Blockchain/>
</Tab> </Tab>