1
0
mirror of https://github.com/oceanprotocol/react-tutorial synced 2024-11-21 17:26:58 +01:00

cleanup and style fixes

This commit is contained in:
Klaudiusz Dembler 2020-03-12 09:16:09 +01:00
parent 5ca05440e4
commit 3fecbc4cbf
No known key found for this signature in database
GPG Key ID: 14B9FB649EE34C35
4 changed files with 154 additions and 148 deletions

View File

@ -3,7 +3,7 @@
"version": "1.0.0",
"description": "React + squid.js interacting in the most minimal way with Ocean Protocol.",
"dependencies": {
"@oceanprotocol/squid": "^2.0.0-beta.2",
"@oceanprotocol/squid": "^2.0.0-beta.4",
"react": "^16.12.0",
"react-dom": "^16.12.0",
"react-scripts": "^3.3.0",

View File

@ -2,48 +2,54 @@ import React, { useState } from 'react'
import * as Assets from './asset'
export default function Compute({ ocean, web3 }) {
const [ddoAsset, setDdoAsset] = useState('')
const [ddoAsset, setDdoAsset] = useState({ id: '' })
const [jobStatus, setJobStatus] = useState('')
const [jobId, setJobId] = useState('')
const [agreementId, setAgreementId] = useState('')
const [ddoAlgorithm, setDdoAlgorithm] = useState('')
const computestate = {
inputdid: '',
algodid: '',
algooutput:''
}
const [ddoAlgorithm, setDdoAlgorithm] = useState({ id: '' })
// publish a dataset and an algorithm
async function publish() {
try {
const accounts = await ocean.accounts.list()
console.log('Publishing asset.')
const service=await Assets.createComputeService(ocean,accounts[0],"0","2020-03-10T10:00:00Z")
const service = await Assets.createComputeService(
ocean,
accounts[0],
'0',
'2020-03-10T10:00:00Z'
)
console.log(service)
const ddoAssetNew = await ocean.assets.create(Assets.getAsset(), accounts[0],[service])
const ddoAssetNew = await ocean.assets.create(
Assets.getAsset(),
accounts[0],
[service]
)
console.log('Asset successfully submitted.')
console.log(ddoAssetNew)
// keep track of this registered asset for consumption later on
setDdoAsset(ddoAssetNew)
alert( 'Asset successfully submitted.' )
alert('Asset successfully submitted.')
} catch (error) {
console.error(error.message)
}
}
async function publishalgo() {
try {
const accounts = await ocean.accounts.list()
console.log('Publishing algo.')
const ddoAlgorithmNew = await ocean.assets.create(Assets.getAlgoAsset(), accounts[0])
const ddoAlgorithmNew = await ocean.assets.create(
Assets.getAlgoAsset(),
accounts[0]
)
console.log(ddoAlgorithmNew)
console.log('Algo asset successfully submitted.')
// keep track of this registered asset for consumption later on
setDdoAlgorithm(ddoAlgorithmNew)
alert( 'Algorithm successfully submitted.' )
alert('Algorithm successfully submitted.')
} catch (error) {
console.error(error.message)
}
@ -65,7 +71,7 @@ export default function Compute({ ocean, web3 }) {
)
setJobId(status.jobId)
console.log(status)
alert( 'Job created. You can query for status now' )
alert('Job created. You can query for status now')
} catch (error) {
console.error(error.message)
}
@ -76,11 +82,7 @@ export default function Compute({ ocean, web3 }) {
const accounts = await ocean.accounts.list()
// start a compute job
const status = await ocean.compute.status(
accounts[0],
agreementId,
jobId
)
const status = await ocean.compute.status(accounts[0], agreementId, jobId)
setJobStatus(JSON.stringify(status, null, '\t'))
console.log(status)
} catch (error) {
@ -99,7 +101,6 @@ export default function Compute({ ocean, web3 }) {
<button onClick={() => publishalgo()} disabled={!web3}>
2) Publish algorithm
</button>
<button onClick={() => start()} disabled={!web3}>
3)Order and start compute service
</button>
@ -107,14 +108,17 @@ export default function Compute({ ocean, web3 }) {
4)Get Job Status
</button>
<hr />
Asset DID:<input type="text" value={ddoAsset.id}></input>
Asset DID:
<input type="text" value={ddoAsset.id} readOnly />
<hr />
Algo DID:<input type="text" value={ddoAlgorithm.id}></input>
Algo DID:
<input type="text" value={ddoAlgorithm.id} readOnly />
<hr />
Job ID:<input type="text" value={jobId}></input>
Job ID:
<input type="text" value={jobId} readOnly />
<hr />
Compute status:<textarea rows="10" cols="180" value={jobStatus}></textarea>
Compute status:
<textarea rows="10" cols="180" value={jobStatus} readOnly />
</>
)
}

View File

@ -1,121 +1,120 @@
export function getAsset(){
const asset = {
main: {
name: '10 Monkey Species Small',
dateCreated: '2012-02-01T10:55:11Z',
author: 'Mario',
type: 'dataset',
license: 'CC0: Public Domain',
price: '0',
files: [
{
index: 0,
contentType: 'application/zip',
checksum: '2bf9d229d110d1976cdf85e9f3256c7f',
checksumType: 'MD5',
contentLength: '12057507',
compression: 'zip',
encoding: 'UTF-8',
url:
'https://s3.amazonaws.com/datacommons-seeding-us-east/10_Monkey_Species_Small/assets/training.zip'
},
{
index: 1,
contentType: 'text/txt',
checksum: '354d19c0733c47ef3a6cce5b633116b0',
checksumType: 'MD5',
contentLength: '928',
url:
'https://s3.amazonaws.com/datacommons-seeding-us-east/10_Monkey_Species_Small/assets/monkey_labels.txt'
}
]
},
additionalInformation: {
categories: ['Biology'],
tags: ['image data', 'classification', 'animals'],
description: 'EXAMPLE ONLY ',
copyrightHolder: 'Unknown',
workExample: 'image path, id, label',
links: [
{
name: 'example model',
url:
'https://drive.google.com/open?id=1uuz50RGiAW8YxRcWeQVgQglZpyAebgSM'
},
{
name: 'example code',
type: 'example code',
url: 'https://github.com/slothkong/CNN_classification_10_monkey_species'
}
],
inLanguage: 'en'
}
}
return(asset)
}
export function getAlgoAsset(){
const algoasset = {
main: {
name: 'My great algo',
dateCreated: '2012-02-01T10:55:11Z',
author: 'Alex',
type: "algorithm",
algorithm: {
format: "docker-image",
version: "0.1",
container: {
entrypoint: "node $ALGO",
image: "node",
tag: "10"
}
},
license: 'CC0: Public Domain',
price: '0',
files: [
{
index: 0,
contentType: 'application/text',
contentLength: '12057507',
compression: 'zip',
encoding: 'UTF-8',
url: 'https://raw.githubusercontent.com/oceanprotocol/test-algorithm/master/javascript/algo.js'
}
]
},
additionalInformation: {
description: 'My super algo '
}
}
return(algoasset)
export function getAsset() {
const asset = {
main: {
name: '10 Monkey Species Small',
dateCreated: '2012-02-01T10:55:11Z',
author: 'Mario',
type: 'dataset',
license: 'CC0: Public Domain',
price: '0',
files: [
{
index: 0,
contentType: 'application/zip',
checksum: '2bf9d229d110d1976cdf85e9f3256c7f',
checksumType: 'MD5',
contentLength: '12057507',
compression: 'zip',
encoding: 'UTF-8',
url:
'https://s3.amazonaws.com/datacommons-seeding-us-east/10_Monkey_Species_Small/assets/training.zip'
},
{
index: 1,
contentType: 'text/txt',
checksum: '354d19c0733c47ef3a6cce5b633116b0',
checksumType: 'MD5',
contentLength: '928',
url:
'https://s3.amazonaws.com/datacommons-seeding-us-east/10_Monkey_Species_Small/assets/monkey_labels.txt'
}
]
},
additionalInformation: {
categories: ['Biology'],
tags: ['image data', 'classification', 'animals'],
description: 'EXAMPLE ONLY ',
copyrightHolder: 'Unknown',
workExample: 'image path, id, label',
links: [
{
name: 'example model',
url:
'https://drive.google.com/open?id=1uuz50RGiAW8YxRcWeQVgQglZpyAebgSM'
},
{
name: 'example code',
type: 'example code',
url:
'https://github.com/slothkong/CNN_classification_10_monkey_species'
}
],
inLanguage: 'en'
}
}
return asset
}
export async function createComputeService(ocean: Ocean,publisher: Account,price: string,datePublished: string){
const { templates } = ocean.keeper
const serviceAgreementTemplate = await templates.escrowComputeExecutionTemplate.getServiceAgreementTemplate()
const name = 'dataAssetComputingServiceAgreement'
const service = {
type: 'compute',
serviceEndpoint: ocean.brizo.getComputeEndpoint(),
templateId: templates.escrowComputeExecutionTemplate.getId(),
attributes: {
main: {
creator: publisher.getId(),
datePublished,
price,
timeout: 3600,
name
},
serviceAgreementTemplate
}
}
return(service)
export function getAlgoAsset() {
const algoasset = {
main: {
name: 'My great algo',
dateCreated: '2012-02-01T10:55:11Z',
author: 'Alex',
type: 'algorithm',
algorithm: {
format: 'docker-image',
version: '0.1',
container: {
entrypoint: 'node $ALGO',
image: 'node',
tag: '10'
}
},
license: 'CC0: Public Domain',
price: '0',
files: [
{
index: 0,
contentType: 'application/text',
contentLength: '12057507',
compression: 'zip',
encoding: 'UTF-8',
url:
'https://raw.githubusercontent.com/oceanprotocol/test-algorithm/master/javascript/algo.js'
}
]
},
additionalInformation: {
description: 'My super algo '
}
}
return algoasset
}
//export default Assets
export async function createComputeService(
ocean,
publisher,
price,
datePublished
) {
const { templates } = ocean.keeper
const serviceAgreementTemplate = await templates.escrowComputeExecutionTemplate.getServiceAgreementTemplate()
const name = 'dataAssetComputingServiceAgreement'
const service = {
type: 'compute',
serviceEndpoint: ocean.brizo.getComputeEndpoint(),
templateId: templates.escrowComputeExecutionTemplate.getId(),
attributes: {
main: {
creator: publisher.getId(),
datePublished,
price,
timeout: 3600,
name
},
serviceAgreementTemplate
}
}
return service
}

View File

@ -16,7 +16,7 @@ class App extends Component {
state = {
ocean: undefined,
results: [],
ddo: undefined
ddo: undefined
}
async componentDidMount() {
@ -42,7 +42,10 @@ class App extends Component {
async registerAsset() {
try {
const accounts = await this.state.ocean.accounts.list()
const ddo = await this.state.ocean.assets.create(Assets.getAsset(), accounts[0])
const ddo = await this.state.ocean.assets.create(
Assets.getAsset(),
accounts[0]
)
console.log('Asset successfully submitted.')
console.log(ddo)
// keep track of this registered asset for consumption later on