Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Sprint nine #30

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
50 changes: 50 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 2 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -6,13 +6,15 @@
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.5.0",
"@testing-library/user-event": "^7.2.1",
"autosuggest-highlight": "^3.1.1",
"bootstrap": "^4.5.2",
"d3": "^6.2.0",
"date-fns": "^2.16.1",
"plotly.js": "^1.55.2",
"query-string": "^6.13.5",
"rc-slider": "^9.5.3",
"react": "^16.13.1",
"react-autosuggest": "^10.0.3",
"react-bootstrap": "^1.3.0",
"react-bootstrap-range-slider": "^1.2.2",
"react-dom": "^16.13.1",
Expand Down
119 changes: 119 additions & 0 deletions src/_App/AboutSticky.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,119 @@

import React from 'react'
import Container from 'react-bootstrap/Container'
//import Row from 'react-bootstrap/Row'
//import Col from 'react-bootstrap/Col'
import Card from 'react-bootstrap/Card'

import { StickyContainer, Sticky } from 'react-sticky';

const styles = {

};

export default function AboutSticky() {

return (
<Container>

<div style={{ height: "10px" }} />
<StickyContainer style={{ height: "300px", marginBottom:"0px" }}>


<Sticky>
{({ style }) => (
<div
style={{ style, height: "100px", width: "100%", float: "right"}}
>
<Card>
<Card.Body>
<Card.Title><h2>About</h2></Card.Title>
<Card.Text>
This project builds upon the research of Tauhid Zaman, Nicolas Guenon Des Mesnards, et. al., as described by the paper: <a href="https://arxiv.org/abs/1810.12398">"Detecting Bots and Assessing Their Impact in Social Networks"</a> (2018).
</Card.Text>

<Card.Text>
For this project, we analyzed tweets about the Trump Impeachment proceedings, with the aim of identifying automated Twitter accounts known as "bots," analyzing their behaviors, and assessing their impact on the conversation.
{" "}We then use bot community language patterns to train opinion models to measure media bias on Twitter.
</Card.Text>
</Card.Body>
</Card>
</div>
)}
</Sticky>



</StickyContainer>
<Card>
<Card.Body>
<Card.Title><h3>Methodology</h3></Card.Title>

<Card.Text>
Read about our methodology in chronological order by following the outline below:
</Card.Text>

{/* todo: make this from the sidebar sitemap */}
<ol type="I">
<li>Tweet Collection
<ol>
<li><a href="/collection-topics">Collection Topics</a></li>
<li><a href="/collection-timeline">Collection Timeline</a></li>
<li><a href="/collection-results">Collection Results</a></li>
</ol>
</li>

<li>Bot Analysis
<ol>
<li><a href="/bot-classification">Bot Classification</a></li>
<li><a href="/bot-communities">Bot Communities</a></li>
<li><a href="/bot-language">Bot Language</a></li>
<li><a href="/bot-impact">Bot Impact</a></li>
</ol>
</li>


<li>Opinion Analysis
<ol>
<li><a href="/opinion-models">Opinion Models</a></li>
<li><a href="/user-opinions">User Opinions</a></li>
<li><a href="/top-user-opinions">Top User Opinions</a></li>
</ol>
</li>
</ol>
</Card.Body>
</Card>

<Card>
<Card.Body>
<Card.Title><h3>Team</h3></Card.Title>

<ul>
<li><a href="https://www.zlisto.com/">Prof. Tauhid Zaman</a> (Yale University)</li>
<li><a href="http://data-creative.info/team/">Michael J Rossetti</a> (Georgetown University, New York University)</li>
<li>Special thanks to <a href="https://scholar.google.com/citations?hl=en&user=Xw7yaiUAAAAJ">Mohammad Samiul Islam</a> for front-end development and data visualization contributions!</li>
</ul>
</Card.Body>
</Card>

<Card>
<Card.Body>
<Card.Title><h3>Source Code</h3></Card.Title>

<ul>
<li><a href="https://github.com/zaman-lab/tweet-analyzer-py/blob/master/start">Tweet Collection and Analysis (Colab Notebooks)</a></li>
<li><a href="https://github.com/zaman-lab/tweet-analyzer-py">Tweet Collection and Analysis (Python Scripts)</a></li>
<li><a href="https://github.com/zaman-lab/tweet-analyzer-py/blob/master/api">Tweet Analysis API (Flask)</a></li>
<li><a href="https://github.com/zaman-lab/impeachment-web-react">Tweet Analysis Website (React)</a></li>
</ul>

</Card.Body>
</Card>





</Container>
)
}
67 changes: 67 additions & 0 deletions src/_App/App.css
Original file line number Diff line number Diff line change
Expand Up @@ -173,6 +173,73 @@ top:300px;
}



/* React type ahead search */

.react-autosuggest__container {
position: relative;
}

.react-autosuggest__input {
width: 240px;
height: 30px;
padding: 10px 20px;
font-family: Helvetica, sans-serif;
font-weight: 300;
font-size: 16px;
border: 1px solid #aaa;
border-radius: 4px;
}

.react-autosuggest__input--focused {
outline: none;
}

.react-autosuggest__input--open {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}

.react-autosuggest__suggestions-container {
display: none;
}

.react-autosuggest__suggestions-container--open {
display: block;
position: absolute;
top: 51px;
width: 280px;
border: 1px solid #aaa;
background-color: #fff;
font-family: Helvetica, sans-serif;
font-weight: 300;
font-size: 16px;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
z-index: 2;
}

.react-autosuggest__suggestions-list {
margin: 0;
padding: 0;
list-style-type: none;
}

.react-autosuggest__suggestion {
cursor: pointer;
padding: 10px 20px;
}

.react-autosuggest__suggestion--highlighted {
background-color: #ddd;
}

.react-autosuggest__suggestion-match {
color: #00276c;
font-weight: bold;
}


/*
##Device = Most of the Smartphones Mobiles (Portrait)
##Screen = B/w 320px to 479px
Expand Down
6 changes: 5 additions & 1 deletion src/_App/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,13 +10,15 @@ import Container from 'react-bootstrap/Container'
import Row from 'react-bootstrap/Row'
import Col from 'react-bootstrap/Col'
//import Card from 'react-bootstrap/Card'

import 'bootstrap/dist/css/bootstrap.min.css'
import './App.css'

import Home from './Home.js'
import About from './About.js'
import sidebar from './sidebar.js'
import AboutSticky from './AboutSticky'



ReactGA.initialize(process.env.REACT_APP_GA_TRACKER_ID, {debug: true})

Expand Down Expand Up @@ -76,6 +78,7 @@ export default function App() {
<Navbar.Collapse id="basic-navbar-nav">
<Nav className="ml-auto">
<Nav.Link href="/about">About</Nav.Link>
<Nav.Link href="/aboutsticky">About</Nav.Link>
</Nav>
</Navbar.Collapse>
</Navbar>
Expand Down Expand Up @@ -118,6 +121,7 @@ export default function App() {
<Switch>
<Route path="/" exact component={Home} />
<Route path="/about" component={About} />
<Route path="/aboutsticky" component={AboutSticky} />
{sidebarRoutes}
</Switch>
</Col>
Expand Down
Loading