dank swag pop and lolz

This commit is contained in:
E 2021-03-07 21:58:36 -07:00
parent 91e26fe9fc
commit 9fe790ed9c
2 changed files with 47 additions and 27 deletions

View File

@ -23,16 +23,17 @@ export const Session = (props: Props) => {
const [active, setActive] = useState(false)
const handleStartSession = async () => {
await startSession(clientId)
message.loading('Photo sequence starting! Stand by...')
await startSession(clientId)
setActive(true)
}
const handleRestartSession = async () => {
setActive(false)
message.loading('Removing all photos...')
message.loading(
'Deleting photos & restarting capture sequence! Stand by...',
)
await restartSession(clientId)
message.loading('Restarting capture sequence! Stand by...')
setActive(true)
}
@ -42,6 +43,7 @@ export const Session = (props: Props) => {
const handleNuke = async () => {
await killSession(clientId)
message.success('Photos Deleted! Going back to dashboard')
history.push('/')
}

View File

@ -1,9 +1,7 @@
import React, { useEffect, useState } from 'react'
import { Card, Spin } from 'antd'
import { Card, Modal, Spin } from 'antd'
import { getSession } from '../api'
import { client } from '../data'
import settings from '../settings'
import { url } from 'inspector'
type Props = {
clientId: string
@ -11,6 +9,7 @@ type Props = {
export const SessionPictures = ({ clientId }: Props) => {
const [urls, setUrls] = useState<string[] | null>(null)
const [activeUrl, setActiveUrl] = useState<string | null>(null)
useEffect(() => {
const get = async () => {
@ -20,36 +19,55 @@ export const SessionPictures = ({ clientId }: Props) => {
if (photos.length) setUrls(photos)
}
const interval = setInterval(get, 5000)
const interval = setInterval(get, 250)
return () => clearInterval(interval)
}, [clientId, urls])
const closeModal = () => setActiveUrl(null)
const host = settings.env === 'jank' ? 'http://192.168.1.107:5000' : ''
if (!urls?.length) return null
return (
<div>
<h3>Session Pictures</h3>
<div className="photo-wall">
{urls ? (
urls
.sort((a, b) => a.split('_')[0].localeCompare(b.split('_')[0]))
.map((src) => (
<Card className="photo" title={src.split('_')[0]}>
<img
key={src}
id={src}
src={`${host}/output/${clientId}/${src}`}
alt="lol"
/>
</Card>
))
) : (
<Spin />
)}
<>
<Modal
visible={!!activeUrl}
onOk={closeModal}
cancelText={null}
onCancel={closeModal}
width="50%"
>
<img
width="100%"
onClick={closeModal}
src={`${host}/output/${clientId}/${activeUrl}`}
alt="large image"
></img>
</Modal>
<div>
<h3>Session Pictures</h3>
<div className="photo-wall">
{urls ? (
urls
.sort((a, b) => a.split('_')[0].localeCompare(b.split('_')[0]))
.map((src) => (
<Card className="photo" title={src.split('_')[0]}>
<img
onClick={() => setActiveUrl(src)}
key={src}
id={src}
src={`${host}/output/${clientId}/${src}`}
alt="lol"
/>
</Card>
))
) : (
<Spin />
)}
</div>
</div>
</div>
</>
)
}