Skip to content

2
2022-073
Commit a8197730 authored by Nilan Meegoda's avatar Nilan Meegoda
Browse files
Options

fix 2

parent b3de611b
Hide whitespace changes
Inline Side-by-side
Showing with 62 additions and 29 deletions
web-app/frontend/src/pages/attention_demo/attentionspan.jsx
View file @ a8197730
......@@ -24,6 +24,7 @@ const AttentionSpan_screen = () => {
const navigate = useNavigate();
const [attention, setattention] = useState([]);
const [videoLink, setVideoLink] = useState("");
const [isClicked, setisClicked] = useState(false);
const [teststate, setTestState] = useState(false);
const [teststate2, setTestState2] = useState(false);
const [teststate3, setTestState3] = useState(false);
......@@ -77,6 +78,7 @@ const AttentionSpan_screen = () => {
})
.then((res) => {
setattention(res.data);
setisClicked(true);
})
.catch((err) => {
console.log(err);
......@@ -153,7 +155,8 @@ const AttentionSpan_screen = () => {
<br className="hidden lg:inline-block" />
</h1>
<p className="mb-8 leading-relaxed text-white">
Dear child please watch this video until the end. It's a story of polar bear who likes to play alot.
Dear child please watch this video until the end. It's a story
of polar bear who likes to play alot.
</p>
<div className="flex justify-center">
<button
......@@ -212,16 +215,30 @@ const AttentionSpan_screen = () => {
</p>
<div className="m-2 mt-6">
<header className="App-header text-white">
{/* Calling a data from setdata for showing */}
<p>Low level attention : {attention ? attention[0] * 100 : "processing.."}</p>
<p>Mid level attention : {attention ? attention[1] * 100 : "processing.."}</p>
<p>High level attention : {attention ? attention[2] * 100 : "processing.."}</p>
{!isClicked ? (
<h2>Results are processing..</h2>
) : (
<>
<p>
Low level attention :{" "}
{attention[0] * 100}
</p>
<p>
Mid level attention :{" "}
{attention[1] * 100}
</p>
<p>
High level attention :{" "}
{attention[2] * 100}
</p>
</>
)}
</header>
</div>
<div className="mt-4">
<button
className="ml-4 inline-flex text-gray-700 bg-gray-100 border-0 py-2 px-6 focus:outline-none hover:bg-gray-200 rounded text-lg"
onClick={() => setTestState(false)}
onClick={() => {setTestState(false); setisClicked(false);}}
>
Get Back
</button>
......@@ -250,10 +267,7 @@ const AttentionSpan_screen = () => {
<br className="hidden lg:inline-block" />
</h1>
<p className="mb-8 text-white leading-relaxed">
Copper mug try-hard pitchfork pour-over freegan heirloom neutra
air plant cold-pressed tacos poke beard tote bag. Heirloom echo
park mlkshk tote bag selvage hot chicken authentic tumeric
truffaut hexagon try-hard chambray.
Dear child please watch this video.
</p>
<div className="flex justify-center">
<button
......@@ -315,16 +329,30 @@ const AttentionSpan_screen = () => {
</p>
<div className="m-2 mt-6">
<header className="App-header text-white">
{/* Calling a data from setdata for showing */}
<p>Low level attention : {attention[0] * 100}</p>
<p>Mid level attention : {attention[1] * 100}</p>
<p>High level attention : {attention[2] * 100}</p>
{!isClicked ? (
<h2>Results are processing..</h2>
) : (
<>
<p>
Low level attention :{" "}
{attention[0] * 100}
</p>
<p>
Mid level attention :{" "}
{attention[1] * 100}
</p>
<p>
High level attention :{" "}
{attention[2] * 100}
</p>
</>
)}
</header>
</div>
<div className="mt-4">
<button
className="ml-4 inline-flex text-gray-700 bg-gray-100 border-0 py-2 px-6 focus:outline-none hover:bg-gray-200 rounded text-lg"
onClick={() => setTestState2(false)}
onClick={() => {setTestState2(false); setisClicked(false);}}
>
Get Back
</button>
......@@ -415,25 +443,30 @@ const AttentionSpan_screen = () => {
</p>
<div className="m-2 mt-6">
<header className="App-header text-white">
{/* Calling a data from setdata for showing */}
<p>
Low level attention :{" "}
{attention[0] ? attention[0] * 100 : "Processing.."}
</p>
<p>
Mid level attention :{" "}
{attention[1] ? attention[1] * 100 : "Processing.."}
</p>
<p>
High level attention :{" "}
{attention[2] ? attention[2] * 100 : "Processing.."}
</p>
{!isClicked ? (
<h2>Results are processing..</h2>
) : (
<>
<p>
Low level attention :{" "}
{attention[0] * 100}
</p>
<p>
Mid level attention :{" "}
{attention[1] * 100}
</p>
<p>
High level attention :{" "}
{attention[2] * 100}
</p>
</>
)}
</header>
</div>
<div className="mt-4">
<button
className="ml-4 inline-flex text-gray-700 bg-gray-100 border-0 py-2 px-6 focus:outline-none hover:bg-gray-200 rounded text-lg"
onClick={() => setTestState3(false)}
onClick={() => {setTestState3(false); setisClicked(false);}}
>
Get Back
</button>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment