diff --git a/app/components/projects/CreateProject.jsx b/app/components/projects/CreateProject.jsx index cd7fce0..44ced88 100644 --- a/app/components/projects/CreateProject.jsx +++ b/app/components/projects/CreateProject.jsx @@ -1,4 +1,4 @@ -import React, { createRef } from 'react' +import React, { createRef, useState } from 'react' import { Formik } from 'formik' import TextField from '@material-ui/core/TextField' import Divider from '@material-ui/core/Divider' @@ -8,6 +8,7 @@ import Button from '@material-ui/core/Button' import InputAdornment from '@material-ui/core/InputAdornment' import CloudUpload from '@material-ui/icons/CloudUpload' import { withStyles } from '@material-ui/core/styles' +import { captureFile, formatForIpfs, uploadToIpfs } from '../../utils/ipfs' const styles = theme => ({ root: { @@ -56,6 +57,7 @@ const styles = theme => ({ } }) +const isWeb = str => str.includes('http') const createJSON = values => { const { title, @@ -83,7 +85,7 @@ const createJSON = values => { type: 'video' } } - return JSON.stringify(manifest) + return JSON.stringify(manifest, null, 2) } const Title = ({ className }) => ( @@ -95,6 +97,7 @@ const Title = ({ className }) => ( let uploadInput = createRef() const SubmissionSection = ({ classes }) => { + const [uploads, setUploads] = useState({}) return ( { }} onSubmit={async (values, { resetForm }) => { const manifest = createJSON(values) - console.log({manifest}) + let fileLists = [] + Object.keys(uploads).forEach(k => { + fileLists = [ ...fileLists, formatForIpfs(uploads[k][0]) ] + }) + fileLists.push({ + path: '/root/manifest.json', content: Buffer.from(manifest) + }) + const contentHash = await uploadToIpfs(fileLists) + //saveToIpfs(fileLists, console.log, console.log) + console.log({manifest, values, uploads, fileLists, contentHash}) }} > @@ -136,11 +148,12 @@ const SubmissionSection = ({ classes }) => { const file = e.target.files const { activeField } = status setFieldValue(activeField, file[0]['name']) + setUploads({ ...uploads, [activeField]: file }) setStatus({ ...status, - fields: { ...status.fields, [activeField]: file } + activeField: null }) - console.log({file, activeField, status}) + console.log({file, activeField, status}, e.target) } } style={{ display: 'none' }} @@ -263,6 +276,19 @@ const SubmissionSection = ({ classes }) => { + { + const activeField = 'video' + setStatus({ ...status, activeField }) + uploadInput.click() + } + } + /> + + ), classes: { input: classes.textInput } diff --git a/app/utils/ipfs.js b/app/utils/ipfs.js index 6b9c4c4..8fdbd75 100644 --- a/app/utils/ipfs.js +++ b/app/utils/ipfs.js @@ -21,7 +21,7 @@ export const captureFile = (event, cb, imgCb) => { saveToIpfs(formattedFiles, cb, imgCb) } -const formatFileList = files => { +export const formatFileList = files => { const formattedList = [] for (let i=0; i { return formattedList } -const formatForIpfs = file => { +export const formatForIpfs = file => { const { name, type } = file const content = fileReaderPullStream(file) return { @@ -37,7 +37,7 @@ const formatForIpfs = file => { content } } -const saveToIpfs = (files, cb, imgCb) => { +export const saveToIpfs = (files, cb, imgCb) => { let ipfsId ipfs.add(files, { progress: (prog) => console.log(`received: ${prog}`) }) .then((response) => { @@ -50,6 +50,11 @@ const saveToIpfs = (files, cb, imgCb) => { }) } +export const uploadToIpfs = async files => { + const res = await ipfs.add(files, { progress: (prog) => console.log(`received: ${prog}`) }) + return `ipfs/${res[0].hash}` +} + export const getImageFromIpfs = async (hash, cb) => { const res = await getFromIpfs(hash) cb(res)