{"version":3,"sources":["App.tsx","index.tsx"],"names":["useStyles","makeStyles","theme","appBar","position","layout","width","marginLeft","spacing","marginRight","breakpoints","up","paper","marginTop","marginBottom","padding","stepper","buttons","display","justifyContent","button","AppState","selectedFiles","fileStates","isProcessing","id2Offset","offset2Id","this","Map","App","useState","state","setState","apiRoot","window","location","host","protocol","ws","WebSocket","processPDF","fileObj","fileOffset","a","formData","FormData","append","axios","post","headers","uploadResult","set","data","send","JSON","stringify","event","i","length","onmessage","msg","evt","parse","console","log","newStatus","step","status","offset","get","job_id","undefined","stillProcessing","classes","className","Paper","Typography","component","variant","align","LinearProgress","FormGroup","disabled","style","id","multiple","type","onChange","target","files","file","item","push","htmlFor","Button","color","Grid","List","map","idx","ListItem","secondaryAction","CircularProgress","IconButton","edge","aria-label","onClick","open","Download","ListItemAvatar","ListItemText","primary","name","secondary","ReactDOM","render","StrictMode","document","getElementById"],"mappings":"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","file":"static/js/main.e82c8351.chunk.js","sourcesContent":["import React, { ChangeEvent, useState } from 'react';\nimport './App.css';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { Button, CircularProgress, FormGroup, Grid, List, ListItem, ListItemAvatar, ListItemText, Paper, Typography } from '@mui/material';\nimport DescriptionIcon from '@mui/icons-material/Description';\nimport { IconButton, LinearProgress } from '@material-ui/core';\nimport axios, { AxiosResponse } from 'axios';\nimport { Download as DownloadIcon } from '@mui/icons-material';\n\nconst useStyles : any = makeStyles((theme: any) => ({\n  appBar: {\n    position: 'relative',\n  },\n  layout: {\n    width: 'auto',\n    marginLeft: theme.spacing(2),\n    marginRight: theme.spacing(2),\n    [theme.breakpoints.up(600 + theme.spacing(2) * 2)]: {\n      width: 600,\n      marginLeft: 'auto',\n      marginRight: 'auto',\n    },\n  },\n  paper: {\n    marginTop: theme.spacing(3),\n    marginBottom: theme.spacing(3),\n    padding: theme.spacing(2),\n    [theme.breakpoints.up(600 + theme.spacing(3) * 2)]: {\n      marginTop: theme.spacing(6),\n      marginBottom: theme.spacing(6),\n      padding: theme.spacing(3),\n    },\n  },\n  stepper: {\n    padding: theme.spacing(3, 0, 5),\n  },\n  buttons: {\n    display: 'flex',\n    justifyContent: 'flex-end',\n  },\n  button: {\n    marginTop: theme.spacing(3),\n    marginLeft: theme.spacing(1),\n  },\n}));\n\nclass AppState{\n  selectedFiles?: Array<File>\n  fileStates: Array<string>\n  isProcessing: boolean\n  id2Offset: Map<string, number>\n  offset2Id: Map<number, string>\n\n  constructor(){\n    this.fileStates = [];\n    this.isProcessing = false;\n    this.id2Offset = new Map();\n    this.offset2Id = new Map();\n  }\n}\n\ninterface SapientaEvent {\n  step: string\n  status: string\n  job_id: string\n}\n\n\nfunction App() {\n\n  const [state, setState] = useState(new AppState());\n\n  const apiRoot = (window.location.host === \"localhost:3000\") ? \"localhost:8000\" : window.location.host;\n\n  const protocol = window.location.protocol === \"http:\" ? \"ws:\" : \"wss:\";\n\n  const ws = new WebSocket(`${protocol}//${apiRoot}/ws`);\n\n  ws.onmessage = (msg) => {\n    let evt: SapientaEvent = JSON.parse(msg.data);\n    console.log(evt);\n\n\n    let newStatus = \"\";\n    \n\n    if ((evt.step === \"convert_pdf\") && (evt.status===\"complete\")){\n      newStatus = \"Splitting Sentences\";\n    }\n\n    else if ((evt.step === \"split\") && (evt.status===\"complete\")){\n      newStatus = \"Annotating Sentences\";\n    }\n\n    else if ((evt.step === \"annotate\") && (evt.status===\"complete\")){\n      newStatus = \"Complete\";\n    }\n\n\n    let offset = state.id2Offset.get(evt.job_id);\n\n    if (offset !== undefined) {\n      state.fileStates[offset] = newStatus;\n\n      var stillProcessing = false;\n\n      for(var i=0; i < state.fileStates.length; i++){\n        if (state.fileStates[i] !== \"Complete\"){\n          stillProcessing = true;\n        }\n      }\n\n      state.isProcessing = stillProcessing;\n\n      setState({...state})\n    }\n  }\n  \n  function onFileChange(event: ChangeEvent<HTMLInputElement>){\n    if (event.target.files !== null){\n      var selectedFiles = [];\n      var fileStates = [];\n\n      for(var i=0; i<event.target.files.length; i++){\n        const file = event.target.files.item(i);\n\n        if (file !== null){\n          selectedFiles.push(file);\n          fileStates.push(\"Pending\");\n        }\n\n      }\n\n      state.selectedFiles = selectedFiles;\n      setState({...state, selectedFiles: selectedFiles, fileStates: fileStates});\n    }\n  }\n\n  async function processPDF(fileObj: File, fileOffset: number) {\n    var formData = new FormData();\n    formData.append(\"file\", fileObj)\n\n    state.fileStates[fileOffset] = \"Uploading\";\n    setState({...state, fileStates:state.fileStates});\n\n    let uploadResult: AxiosResponse<any> = await axios.post(`//${apiRoot}/submit`, formData,{\n      headers: {\"Content-Type\": \"multipart/form-data\"}\n    });\n\n    state.fileStates[fileOffset] = \"Processing...\";\n    state.id2Offset.set(uploadResult.data[\"job_id\"], fileOffset);\n    state.offset2Id.set(fileOffset, uploadResult.data[\"job_id\"]);\n\n    setState({...state});\n\n    ws.send(JSON.stringify({\"action\":\"subscribe\", \"job_id\":uploadResult.data[\"job_id\"]}))\n  \n  }\n\n  async function onUploadFiles(event: React.MouseEvent<HTMLButtonElement>) {\n\n      if(!state.selectedFiles){\n        return;\n      }\n\n      state.isProcessing = true;\n\n    \n      setState({...state});\n\n      for(var i=0; i<state.selectedFiles?.length; i++){\n\n          if (state.selectedFiles[i] != null){\n            \n            try{\n              await processPDF(state.selectedFiles[i], i);\n            }catch{\n              state.fileStates[i] = \"Failed\";\n              setState({...state, fileStates:state.fileStates});\n              continue;\n            }\n            \n\n          }\n          \n      }\n  }\n\n\n  const classes = useStyles();\n\n  function getSecondaryAction(fileOffset: number) {\n    \n    if (state.isProcessing && state.fileStates[fileOffset] !== \"Complete\"){\n      return (<CircularProgress></CircularProgress>)\n    } else if (state.fileStates[fileOffset] === \"Complete\") {\n      return (<IconButton edge=\"end\" \n        aria-label=\"download\" \n        onClick={()=>{window.open(`//${apiRoot}/${state.offset2Id.get(fileOffset)}/result`, \"_blank\")}}>\n           <DownloadIcon /> \n      </IconButton>)\n    }\n\n  }\n\n  return (\n    <div className=\"App\">\n\n      <main className={classes.layout}>\n        <Paper className={classes.paper}>\n          <Typography component=\"h1\" variant=\"h5\" align=\"center\">\n            SAPIENTA: Annotate Papers\n          </Typography>\n\n          \n\n          {(state.isProcessing ? <p>Processing...<LinearProgress/></p> : <p>Please select one or more scientific papers to annotate.</p>)}\n\n          <p>&nbsp;</p>\n\n          <FormGroup>\n            <input disabled={state.isProcessing} style={{ display: 'none' }} id=\"upload-button-file\" multiple type=\"file\" onChange={onFileChange} />\n            <label htmlFor=\"upload-button-file\">\n              <Button component=\"span\" variant=\"contained\" color=\"primary\" disabled={state.isProcessing}>\n                Select File(s)\n              </Button>\n            </label>            \n          </FormGroup>\n\n          {(state.selectedFiles != null && state.selectedFiles.length > 0)  ? (\n            <Grid>\n            <List style={{width: \"100%\"}}>\n              {state.selectedFiles?.map((file, idx) => (\n                <ListItem key={idx} secondaryAction={getSecondaryAction(idx)}>\n                  <ListItemAvatar> <DescriptionIcon/> </ListItemAvatar>\n                  <ListItemText style={{width:\"80%\"}} primary={file?.name} secondary={state.fileStates[idx]}></ListItemText>\n                </ListItem>\n              ) )}\n            </List>\n            <Button disabled={state.isProcessing} color=\"secondary\" variant=\"contained\" onClick={onUploadFiles}>Process Files</Button>\n            </Grid>\n          ) : \"\" }\n        </Paper>\n      </main>\n\n    </div>\n  );\n}\n\nexport default App;\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport './index.css';\nimport App from './App';\n\nReactDOM.render(\n  <React.StrictMode>\n    <App />\n  </React.StrictMode>,\n  document.getElementById('root')\n);\n\n"],"sourceRoot":""}