2021-10-24 17:04:22 +00:00
import Head from 'next/head'
import Image from 'next/image'
import styles from '../styles/Home.module.css'
2021-11-01 11:36:45 +00:00
import Content from '../components/content'
2021-12-21 19:08:36 +00:00
import Navbar from '../components/navbar'
import TrianglesBG from '../components/trianglesbg'
import Alert from '../components/alert'
import Sticker from '../components/sticker'
2021-12-21 22:42:34 +00:00
import Textbox from '../components/textbox'
2021-12-22 18:59:23 +00:00
import Popsicle from '../components/popsicle'
import { useState } from 'react'
2021-10-24 17:04:22 +00:00
export default function Home ( ) {
2021-12-22 18:59:23 +00:00
let [ message , setMessage ] = useState ( '' )
let [ alert , setAlert ] = useState ( false )
2021-10-24 17:04:22 +00:00
return (
2021-11-01 11:36:45 +00:00
< >
2021-10-24 17:04:22 +00:00
< Head >
2021-12-22 18:59:23 +00:00
< title > TheRed . SH / Home < / t i t l e >
2021-10-24 17:04:22 +00:00
< / H e a d >
2021-12-22 18:59:23 +00:00
< Navbar / >
2021-11-01 11:36:45 +00:00
< div className = { styles . Home } >
< Content / >
< / d i v >
2022-02-15 17:08:29 +00:00
{ /* <TrianglesBG /> */ }
2021-12-21 19:08:36 +00:00
< Alert / >
2022-02-15 17:08:29 +00:00
{ /* <Sticker style={{ top: '80px', right: '20px' }}>Hello there! I'm a sticker!<br />This is just a simple demo.<br />A much more finished website will be coming soon!</Sticker> */ }
< Textbox placeholder = "Send anything to me here!" style = { { margin : 'auto' , marginTop : '30px' , display : 'block' , marginBottom : '60px' } } submitOnEnter = { true } submit = { async ( TEXT ) => {
2021-12-22 18:59:23 +00:00
setAlert ( false )
2022-02-15 17:08:29 +00:00
let REQUEST = await fetch ( "/api/submit" , {
2021-12-22 18:59:23 +00:00
method : "POST" ,
headers : {
"Content-Type" : "application/json"
} ,
body : JSON . stringify ( {
2022-02-15 17:08:29 +00:00
text : TEXT
2021-12-22 18:59:23 +00:00
} )
} ) ;
2022-02-15 17:08:29 +00:00
let RESPONSE = await REQUEST . text ( ) ;
setMessage ( RESPONSE ) ;
setAlert ( true ) ;
// fetch('/api/logger', {
// method: 'POST',
// headers: {
// 'Content-Type': 'application/json'
// },
// body: JSON.stringify({
// msg: '[Sent message] Query: '+TEXT+'; Response: '+RESPONSE+'; Request Code: '+REQUEST.status+'; Request Method: POST'
// })
// });
2021-12-22 18:59:23 +00:00
} } / >
2022-02-15 17:08:29 +00:00
{
alert && < Popsicle className = { styles . Popsicality } >
{ message }
< / P o p s i c l e >
}
2021-11-01 11:36:45 +00:00
< / >
2021-10-24 17:04:22 +00:00
)
}