diff options
Diffstat (limited to 'react-frontend/src/App.js')
| -rw-r--r-- | react-frontend/src/App.js | 161 |
1 files changed, 161 insertions, 0 deletions
diff --git a/react-frontend/src/App.js b/react-frontend/src/App.js new file mode 100644 index 0000000..a639edd --- /dev/null +++ b/react-frontend/src/App.js @@ -0,0 +1,161 @@ +// React/component imports +import React, {useEffect, useState} from 'react'; +import WatchDogs from './components/WatchDogs.js'; +import reagan from './images/reagan.png'; +import previewwatchdog from './images/previewwatchdog.png'; +import mainlogo from './images/mainlogo.png'; + + +import './css/Landing.css'; + +function App() { + const [startApp, setStartApp] = useState(false); + + const startModal = () => { + document.getElementById("main-modal").style.display = 'block'; + setStartApp(false); + } + const exitModal = () => { + document.getElementById("main-modal").style.display = 'none'; + setStartApp(true); + } + + + return ( + <> + + {(!startApp) ? + <div className="body" id="main-modal"> + <div class="nav-bar"> + <div class="topnav"> + <a href="#team">Team</a> + <a href="#app-intro">About</a> + <a href="#intro">Home</a> + </div> + </div> + + <main> + + <section id="intro" class="intro"> + <img src={mainlogo} alt="logo"></img> + <button id="enter-watchdogs" onClick={exitModal}>ENTER</button> + </section> + + <section id="1" class="app-preview"> + <img id="preview" src={previewwatchdog}></img> + <span id="preview-text">preview</span> + </section> + + <section id="app-intro"> + <h1 class="heading">About Our App</h1> + <p></p> + <p class="text">WatchDogs utilizes a simple, + interactive interface to provide you with the latest + data relating to high-profile investors’ trades. Directly from + the SEC, WatchDogs relays information regarding “inside” investors + and their recent trades, as well as provides computed values such + as an individual’s net profit from a stock at time of trade and a + ranking of individuals most likely recently involved in insider trading. + The computed “suspicion ranks” are determined using multiple factors + (including recent trade profitability and investor connectedness) + and a complex algorithm. For added convenience, YOU choose the + timeframe WatchDogs considers when analyzing trade data. WatchDogs + makes insider trade data accessible to the public, and provides + low-level intuition regarding which investors are more and less + likely to be committing unlawful insider trading.</p> + <div class="appinfotxt">It is important to remember that suspicion + ranks returned by WatchDogs’ algorithm DO NOT prove--or even suggest--that + an individual has engaged in insider trading. WatchDogs suspicion + ranks should not be interpreted as indication of an individual’s + participation in illegal activity. WatchDogs data, including suspicion ranks, + cannot be used as evidence in legal proceedings. Please use WatchDogs + as it is intended, and use discretion when interpreting algorithmic + results.</div> + <p></p> + <p class="text h2">The Data</p> + <div class="text">WatchDogs uses data retrieved from SEC.gov’s + EDGAR API. Trades analyzed by WatchDogs are of the type Form 4, + meaning the filing individual is an “insider” (e.g. the CEO) at + the company whose stock they are trading. In-app data relating + to investors, trades, and profitability is accessible to the public via + the SEC, and only public data is input to the SuspicionRank algorithm.</div> + <p></p> + <p class="text h2">Our Algorithm</p> + <div class="text">WatchDogs suspicion rank represents the likelihood + of an individual being involved in insider trading. The SuspicionRank algorithm, + a derivative of Lary Page’s PageRank algorithm, considers “insiders” who similarly + trade stocks (within a given timeframe) as “linked”, while simultaneously + considering involved individuals’ net profit on their stocks at the time + of trade. (Obviously, an “inside” investor who makes a counter-productive + trade is not likely to be insider trading.)</div> + <p></p><p></p><p></p><p></p><p></p> + </section> + + <section id="team"> + <div class="team"> + <div id="team-holder" class="center"> + <h1 id="team-heading" class="heading">Meet the Team</h1> + <div id="people-holder"> + <div class="team-person-holder"> + <div class="team-person"> + <img src="" height="100%"></img> + </div> + <p class="team-text">Clark Oh-Willeke</p> + </div> + + <div class="team-person-holder"> + <div class="team-person"> + <img src="" height="100%"></img> + </div> + <p class="team-text">Julia McCauley</p> + </div> + + <div class="team-person-holder"> + <div class="team-person"> + <img src="" height="100%"></img> + </div> + <p class="team-text">Michael Foiani</p> + </div> + + <div class="team-person-holder"> + <div class="team-person"> + <img src={reagan} height="100%"></img> + </div> + <p class="team-text">Reagan Hunt</p> + </div> + </div> + </div> + </div> + </section> + </main> + + <footer id="footer"> + <p></p> + <div class="footer-item">Disclaimer</div> + <p></p> + <div class="footer-subtext">Suspicion ranks returned by <span>WatchDogs</span>’ + algorithm DO NOT prove--or even suggest--that an individual has + engaged in insider trading. <span>WatchDogs</span> suspicion ranks should not + be interpreted as indication of an individual’s participation in + illegal activity. <span>WatchDogs</span> data, including suspicion ranks, cannot + be used as evidence in legal proceedings. Please use WatchDogs as + it is intended, and use discretion when interpreting algorithmic results. + </div> + <p></p> + </footer> + </div> + + : + <WatchDogs></WatchDogs> + } + + </> + ); +} + + + + + + +export default App;
\ No newline at end of file |