85 lines
2.4 KiB
CoffeeScript
85 lines
2.4 KiB
CoffeeScript
import React, { useState, useCallback } from "react"
|
|
import { useDropzone } from "react-dropzone"
|
|
import HelpButton from "./helpButton"
|
|
import LinkButton from "./util/linkButton"
|
|
import * as hooks from "./hooks"
|
|
import * as crypto from "../crypto"
|
|
import * as util from "../util"
|
|
|
|
export default BinaryUpload = ->
|
|
[encrypt, toggleEncrypt] = hooks.useToggle true
|
|
[encrypting, setEncrypting] = useState false
|
|
[file, setFile] = useState null
|
|
|
|
# Paste hook and event
|
|
clearFile = (status) ->
|
|
setFile null if status == 200
|
|
[doPaste, pasting, progress] = hooks.usePaste useCallback clearFile, []
|
|
|
|
# Dropzone hook and event
|
|
onDrop = (files) ->
|
|
setFile files[0]
|
|
{getRootProps, getInputProps, isDragActive} = useDropzone
|
|
onDrop: useCallback onDrop, []
|
|
|
|
# Upload handler, we basically extend the Paste hook with encryption
|
|
doUpload = ->
|
|
if not encrypt
|
|
doPaste file.name, file.type, file
|
|
else
|
|
# Handle encryption
|
|
setEncrypting true
|
|
[key, iv, name, mime, encrypted] = await crypto.encryptFile file
|
|
setEncrypting false
|
|
doPaste name, mime, encrypted, (url) ->
|
|
url + "?crypt#" + key + "+" + iv
|
|
doUpload = useCallback doUpload, [file, encrypt, doPaste]
|
|
doUpload = hooks.useCheckSize file?.size, doUpload
|
|
|
|
<div className="content-pastebin">
|
|
<section className="container">
|
|
<div {...getRootProps({className: 'dropzone'})}>
|
|
<input {...getInputProps()} />
|
|
<p>Drag 'n' drop a file here to upload, or click to select</p>
|
|
</div>
|
|
<aside>
|
|
<p>{
|
|
if not file
|
|
"No Selected File"
|
|
else
|
|
"Selected File: #{file.name}"
|
|
}</p>
|
|
</aside>
|
|
</section>
|
|
<div className="content-buttons">
|
|
<HelpButton />
|
|
<button
|
|
className="button-blue"
|
|
disabled={pasting}
|
|
onClick={toggleEncrypt}
|
|
>
|
|
{ "Encrypt: " + if encrypt then "ON" else "OFF" }
|
|
</button>
|
|
<LinkButton
|
|
className="button-blue"
|
|
disabled={pasting}
|
|
to="/paste/text"
|
|
>
|
|
Text Mode
|
|
</LinkButton>
|
|
<button
|
|
className="button-blue"
|
|
disabled={pasting or not file}
|
|
onClick={doUpload}
|
|
>
|
|
{
|
|
if encrypting
|
|
"Encrypting"
|
|
else if not pasting
|
|
"Upload"
|
|
else
|
|
util.progressText progress
|
|
}
|
|
</button>
|
|
</div>
|
|
</div> |