diff options
author | Julia McCauley <skurvyj@gmail.com> | 2021-04-16 19:46:45 -0400 |
---|---|---|
committer | Julia McCauley <skurvyj@gmail.com> | 2021-04-16 19:46:45 -0400 |
commit | fa4feff17c9e15b86388fd5ee1ac6771ff4d5148 (patch) | |
tree | 72157df02027b860e74097050349d49ebecebc0a /frontend/src/components | |
parent | eab479adc987ab20424a542275a697e0c8dbce61 (diff) | |
parent | a7f1433da5ddf11845251a062da96bc42c631f50 (diff) |
need to pull new frontend Merge branch 'master' of github.com:cs0320-2021/term-project-cohwille-jmccaul3-mfoiani-rhunt2
Diffstat (limited to 'frontend/src/components')
-rw-r--r-- | frontend/src/components/Banner.css | 4 | ||||
-rw-r--r-- | frontend/src/components/Banner.js | 12 | ||||
-rw-r--r-- | frontend/src/components/Hub.js | 26 | ||||
-rw-r--r-- | frontend/src/components/HubList.js | 43 | ||||
-rw-r--r-- | frontend/src/components/HubMap.css | 3 | ||||
-rw-r--r-- | frontend/src/components/HubMap.js | 8 | ||||
-rw-r--r-- | frontend/src/components/SECAPIData.js | 43 |
7 files changed, 0 insertions, 139 deletions
diff --git a/frontend/src/components/Banner.css b/frontend/src/components/Banner.css deleted file mode 100644 index e5016b9..0000000 --- a/frontend/src/components/Banner.css +++ /dev/null @@ -1,4 +0,0 @@ -h1 { - background-color: var(--primary-surface-color); - min-width: 400px; -}
\ No newline at end of file diff --git a/frontend/src/components/Banner.js b/frontend/src/components/Banner.js deleted file mode 100644 index 27eb5e9..0000000 --- a/frontend/src/components/Banner.js +++ /dev/null @@ -1,12 +0,0 @@ -import '../App.css'; -import './Banner.css'; - -function Banner() { - return ( - <> - <h1>Welcome To Watchdogs...</h1> - </> - ); -} - -export default Banner;
\ No newline at end of file diff --git a/frontend/src/components/Hub.js b/frontend/src/components/Hub.js deleted file mode 100644 index 6dbcc57..0000000 --- a/frontend/src/components/Hub.js +++ /dev/null @@ -1,26 +0,0 @@ -// React import -import { useState } from "react"; - -/** - * Componenet for checkins. Has a toggle to show more info. - * @param {Object} props The props of the component. - * @returns {import('react').HtmlHTMLAttributes} A list element holding a checkin's info. - */ -function Hub(props) { - // State - toggled - const [isToggled, setIsToggled] = useState(false); - - return ( - <li className='Checkin' key={props.name}> - <div className="Img-flex"> - <span><span className="Clickable-name" onClick= {(e) => console.log(props.name)}>{props.name}</span> has {props.value}</span> - <img className="Img-btn" hidden={isToggled} onClick={() => setIsToggled((toggle) => !toggle)} src="/round_expand_more_white_18dp.png" alt="image"/> - <img className="Img-btn" hidden={!isToggled} onClick={() => setIsToggled((toggle) => !toggle)} src="/round_expand_less_white_18dp.png" alt="image"/> - </div> - <div hidden={!isToggled}> - Testing field... - </div> - </li>); -} - -export default Hub;
\ No newline at end of file diff --git a/frontend/src/components/HubList.js b/frontend/src/components/HubList.js deleted file mode 100644 index 64dd131..0000000 --- a/frontend/src/components/HubList.js +++ /dev/null @@ -1,43 +0,0 @@ -// React and component imports -import { useEffect, useState } from "react"; -import Hub from './Hub'; - -/** - * Component that build the checkin list and displays checkin info. - * @returns {import('react').HtmlHTMLAttributes} A div with the checkins - * in a vertical layout. - */ -function HubList(props) { - const [hubItems, setHubItems] = useState([]); - - /** - * Loads new the checkins into the current cache/map of checkins. - */ - const updateHubItems = () => { - let tempCheckinItems = []; - const sorted = Object.entries(props.data).sort(([,a],[,b]) => b-a); - console.log(sorted); - for (const [key, value] of sorted) { - tempCheckinItems.push( - <Hub name={key} value={value}></Hub> - ); - } - setHubItems(tempCheckinItems); - } - - // React hook that queries the checkin database every 5 seconds. - useEffect(() => { - updateHubItems(); - }, [props.data]); - - return ( - <div className="User-checkin"> - <div className="Checkins"> - <h2>Individual Suspicion</h2> - <ul className='Checkin-list'>{hubItems}</ul> - </div> - </div> - ); -} - -export default HubList;
\ No newline at end of file diff --git a/frontend/src/components/HubMap.css b/frontend/src/components/HubMap.css deleted file mode 100644 index c23f81d..0000000 --- a/frontend/src/components/HubMap.css +++ /dev/null @@ -1,3 +0,0 @@ -canvas { - background-color: var(--main-bg-color); -}
\ No newline at end of file diff --git a/frontend/src/components/HubMap.js b/frontend/src/components/HubMap.js deleted file mode 100644 index 1c4ae3d..0000000 --- a/frontend/src/components/HubMap.js +++ /dev/null @@ -1,8 +0,0 @@ -import '../App.css'; -import './HubMap.css'; - -function HubMap(props) { - return <canvas></canvas>; -} - -export default HubMap;
\ No newline at end of file diff --git a/frontend/src/components/SECAPIData.js b/frontend/src/components/SECAPIData.js deleted file mode 100644 index b0ad82d..0000000 --- a/frontend/src/components/SECAPIData.js +++ /dev/null @@ -1,43 +0,0 @@ -import React, {useState, useEffect} from 'react'; -import Button from './Button'; -import HubList from './HubList'; -import HubMap from './HubList'; -import './App.css'; -import Banner from './Banner'; - - - -function SECAPIData() { - const [displayData, setDisplayData] = useState({}); - - const sendToBackend = () => { - console.log(dataToBackend); - - fetch("http://localhost:4567/data", { - method: "POST", - body: JSON.stringify({ - "data" : dataToBackend - }), - headers: { - "Content-Type": "application/json", - }, - credentials: "same-origin" - }) - - .then(response => response.json().then(data => setDisplayData(data))) - .catch(error => console.log(error)); - } - - useEffect(() => sendToBackend(), []); - - return ( - <div className="mainGrid"> - <Banner></Banner> - <HubList data={displayData}></HubList> - <HubMap></HubMap> - </div> - ); -} - -export default SECAPIData; -
\ No newline at end of file |