delete useless files in Abstract Utils
parent
67703a4a0c
commit
03d8f58a05
|
|
@ -1,197 +0,0 @@
|
||||||
import React, { useState, useEffect } from 'react'
|
|
||||||
import { connect } from 'react-redux'
|
|
||||||
|
|
||||||
import { createAlbum } from '../../../../../../stores/album/duck/operations'
|
|
||||||
import FormGenerator from '../Abstract Utils/FormGenerator'
|
|
||||||
|
|
||||||
|
|
||||||
const AlbumCreate = ({
|
|
||||||
user,
|
|
||||||
createAlbum,
|
|
||||||
consoleHistory, setConsoleHistory,
|
|
||||||
componentVisible, setComponentVisible,
|
|
||||||
activateConsoleInput
|
|
||||||
}) => {
|
|
||||||
|
|
||||||
const [message, setMessage] = useState('')
|
|
||||||
const [image, setImage] = useState('')
|
|
||||||
const [imageInfo, setImageInfo] = useState('Drop/Click\nfor upload album image...')
|
|
||||||
|
|
||||||
const titleInput = React.createRef()
|
|
||||||
const descriptionInput = React.createRef()
|
|
||||||
|
|
||||||
let inputList = [
|
|
||||||
{
|
|
||||||
type: 'text',
|
|
||||||
name: 'titleAlbum',
|
|
||||||
ref: titleInput
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'text',
|
|
||||||
name: 'descriptionAlbum',
|
|
||||||
ref: descriptionInput
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'file',
|
|
||||||
name: 'imageAlbum',
|
|
||||||
fileType: 'image',
|
|
||||||
dropInfo: imageInfo,
|
|
||||||
setDropInfo: setImageInfo,
|
|
||||||
file: image,
|
|
||||||
setFile: setImage
|
|
||||||
}
|
|
||||||
]
|
|
||||||
|
|
||||||
const create = async (event) => {
|
|
||||||
event.preventDefault()
|
|
||||||
let title = titleInput.current.value
|
|
||||||
let description = descriptionInput.current.value
|
|
||||||
if ( title !== '' && description !== '' ) {
|
|
||||||
await createFetch(title, description)
|
|
||||||
} if ( description === '') {
|
|
||||||
document.getElementById('descriptionAlbumInput').focus()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const createFetch = async (title, description) => {
|
|
||||||
let album = {
|
|
||||||
user_id: user.id,
|
|
||||||
title: title,
|
|
||||||
description: description,
|
|
||||||
image: image,
|
|
||||||
url_code: generateUrlCode(),
|
|
||||||
}
|
|
||||||
await createAlbum(
|
|
||||||
album,
|
|
||||||
user.token
|
|
||||||
).then( response => {
|
|
||||||
setMessage( response['info'] + '\n' )
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
const generateUrlCode = () => {
|
|
||||||
let code = 'op?album='
|
|
||||||
let hash = [
|
|
||||||
'!', '@', '#', '$', '%', '^', '&', '*',
|
|
||||||
'Q', 'W', 'X', 'S', 'q', 'w', 'x', 's'
|
|
||||||
]
|
|
||||||
code +=
|
|
||||||
+ hash[ randomInt(7, 14) ]
|
|
||||||
+ hash[ randomInt(7, 14) ]
|
|
||||||
+ hash[ randomInt(7, 14) ]
|
|
||||||
+ hash[ randomInt(0, 7) ]
|
|
||||||
+ hash[ randomInt(0, 7) ]
|
|
||||||
+ hash[ randomInt(0, 7) ]
|
|
||||||
+ randomInt(0, 9)
|
|
||||||
+ randomInt(0, 9)
|
|
||||||
+ randomInt(0, 9)
|
|
||||||
return code
|
|
||||||
}
|
|
||||||
|
|
||||||
const randomInt = (min, max) => {
|
|
||||||
return min + Math.floor((max - min) * Math.random())
|
|
||||||
}
|
|
||||||
|
|
||||||
useEffect(
|
|
||||||
() => {
|
|
||||||
if ( componentVisible ) {
|
|
||||||
document.getElementById('titleAlbumInput').focus()
|
|
||||||
} else {
|
|
||||||
activateConsoleInput()
|
|
||||||
}
|
|
||||||
if ( message !== '' ) {
|
|
||||||
|
|
||||||
titleInput.current.value = ''
|
|
||||||
descriptionInput.current.value = ''
|
|
||||||
|
|
||||||
setConsoleHistory( consoleHistory + message )
|
|
||||||
setComponentVisible( false )
|
|
||||||
setImage('')
|
|
||||||
setImageInfo('Drop/Click\nfor upload album image...')
|
|
||||||
setMessage('')
|
|
||||||
}
|
|
||||||
}
|
|
||||||
)
|
|
||||||
|
|
||||||
return (
|
|
||||||
<FormGenerator
|
|
||||||
inputList={ inputList }
|
|
||||||
action={ create }
|
|
||||||
/>
|
|
||||||
)
|
|
||||||
|
|
||||||
// const toBase64 = ( file ) => new Promise( (resolve, reject) => {
|
|
||||||
// let fileReader = new FileReader()
|
|
||||||
// fileReader.readAsDataURL( file )
|
|
||||||
// fileReader.onload = () => resolve( fileReader.result )
|
|
||||||
// fileReader.onerror = error => reject( error )
|
|
||||||
// })
|
|
||||||
|
|
||||||
// const onLoadFile = async ( event ) => {
|
|
||||||
// event.preventDefault()
|
|
||||||
// let data = event.target.files[0]
|
|
||||||
// setImage( await toBase64( data ) )
|
|
||||||
// setImageInfos(data.name, data.size)
|
|
||||||
// }
|
|
||||||
|
|
||||||
// const onLoadFileDrop = async ( event ) => {
|
|
||||||
// event.preventDefault()
|
|
||||||
// event.persist()
|
|
||||||
// let data = event.dataTransfer.files[0]
|
|
||||||
// setImage( await toBase64( data ) )
|
|
||||||
// setImageInfos(data.name, data.size)
|
|
||||||
// }
|
|
||||||
|
|
||||||
// const setImageInfos = (name, size) => {
|
|
||||||
// setImageInfo(
|
|
||||||
// 'name: "'
|
|
||||||
// + name
|
|
||||||
// + '"\nsize: '
|
|
||||||
// + (Math.round(size / 100 + 'e-2') / 100 )
|
|
||||||
// + ' MB'
|
|
||||||
// )
|
|
||||||
// }
|
|
||||||
|
|
||||||
// return (
|
|
||||||
// <div
|
|
||||||
// onDrop={ event => onLoadFileDrop(event) }
|
|
||||||
// >
|
|
||||||
// <form
|
|
||||||
// onSubmit={ event => create(event) }>
|
|
||||||
// title:
|
|
||||||
// <input
|
|
||||||
// id='titleAlbumInput'
|
|
||||||
// autoComplete='off'
|
|
||||||
// ref={ titleInput }
|
|
||||||
// /> <br />
|
|
||||||
// description:
|
|
||||||
// <input
|
|
||||||
// id='descriptionAlbumInput'
|
|
||||||
// autoComplete='off'
|
|
||||||
// ref={ descriptionInput }
|
|
||||||
// /> <br />
|
|
||||||
// <pre style={ {marginTop: '25px', marginLeft: '40px'} }>
|
|
||||||
// { imageInfo }
|
|
||||||
// </pre>
|
|
||||||
// <input style={ {marginTop: '-55px'} }
|
|
||||||
// id='imageAlbumInput'
|
|
||||||
// className='uploadInput'
|
|
||||||
// type='file'
|
|
||||||
// autoComplete='off'
|
|
||||||
// onChange={ event => onLoadFile(event) }
|
|
||||||
// /> <br />
|
|
||||||
// <button type='submit' />
|
|
||||||
// </form>
|
|
||||||
// </div>
|
|
||||||
// )
|
|
||||||
}
|
|
||||||
|
|
||||||
const mapStateToProps = state => ({
|
|
||||||
user: state.user
|
|
||||||
})
|
|
||||||
|
|
||||||
const mapDispatchToProps = dispatch => ({
|
|
||||||
createAlbum: (album, token) => createAlbum(album, token)
|
|
||||||
})
|
|
||||||
|
|
||||||
export default connect(mapStateToProps, mapDispatchToProps)(AlbumCreate)
|
|
||||||
Loading…
Reference in New Issue