Skip to content

Commit

Permalink
Removed some components and routes that won't be part of the Feb 23 M…
Browse files Browse the repository at this point in the history
…VP. Building out first version of Candidate route.
  • Loading branch information
DaleMcGrew committed Feb 12, 2016
1 parent 3dd2358 commit 4570ec5
Showing 8 changed files with 220 additions and 17 deletions.
2 changes: 1 addition & 1 deletion src/js/Root.jsx
Original file line number Diff line number Diff line change
@@ -16,7 +16,7 @@ import Settings from './routes/Settings/Settings';
import Location from './routes/Settings/Location';

/* Pages that use Ballot Navigation */
import BallotIndex from './routes/Ballot/BallotIndex';
import BallotIndex from './routes/Ballot/BallotIndex';
import Ballot from './routes/Ballot/Ballot';
import Candidate from './routes/Ballot/Candidate';

File renamed without changes.
4 changes: 2 additions & 2 deletions src/js/components/Ballot/CandidateList.jsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import React, { Component, PropTypes } from 'react';
import Candidate from '../../components/Ballot/Candidate';
import CandidateItem from '../../components/Ballot/CandidateItem';

export default class CandidateList extends Component {
static propTypes = {
@@ -13,7 +13,7 @@ export default class CandidateList extends Component {
render () {
return (
<article className="list-group">
{ this.props.children.map( (child) => <Candidate key={child.we_vote_id} {...child} />) }
{ this.props.children.map( (child) => <CandidateItem key={child.we_vote_id} {...child} />) }
</article>
);
}
103 changes: 103 additions & 0 deletions src/js/components/ItemActionBar2.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,103 @@
import React, { Component, PropTypes } from "react";
import BallotActions from "../actions/BallotActions";
import BallotStore from "../stores/BallotStore";

export default class ItemActionBar2 extends Component {
static propTypes = {
we_vote_id: PropTypes.string.isRequired,
opposeCount: PropTypes.number,
supportCount: PropTypes.number,
is_support: PropTypes.bool,
is_oppose: PropTypes.bool
};

constructor (props) {
super(props);

this.state = {
opposeCount: this.props.opposeCount,
supportCount: this.props.supportCount,
is_support: this.props.is_support,
is_oppose: this.props.is_oppose
};
}

componentDidMount () {
BallotStore.addChangeListener(this._onChange.bind(this));
}

componentWillUnmount () {
BallotStore.removeChangeListener(this._onChange.bind(this));
}

_onChange () {
this.setState({
opposeCount: BallotStore.getOpposeCount(this.props.we_vote_id),
supportCount: BallotStore.getSupportCount(this.props.we_vote_id),
is_support: BallotStore.getIsSupportState(this.props.we_vote_id),
is_oppose: BallotStore.getIsOpposeState(this.props.we_vote_id)
});
}

supportItem () {
BallotActions.voterSupportingSave(this.props.we_vote_id);
}

stopSupportingItem () {
BallotActions.voterStopSupportingSave(this.props.we_vote_id);
}

opposeItem () {
BallotActions.voterOpposingSave(this.props.we_vote_id);
}

stopOpposingItem () {
BallotActions.voterStopOpposingSave(this.props.we_vote_id);
}

render () {
return (
<div className="item-actionbar2 row">
{this.state.is_support ?
<span className="col-xs-4" onClick={ this.stopSupportingItem.bind(this) }>
<span>
{this.state.supportCount} support
<span className="glyphicon glyphicon-small glyphicon-arrow-up">
</span>
</span>
</span>
:
<span className="col-xs-4" onClick={ this.supportItem.bind(this) }>
<span>
{this.state.supportCount} support
<span className="glyphicon glyphicon-small glyphicon-arrow-up">
</span>
</span>
</span>
}
{this.state.is_oppose ?
<span className="col-xs-4" onClick={ this.stopOpposingItem.bind(this) }>
<span>
{this.state.opposeCount} oppose
<span className="glyphicon glyphicon-small glyphicon-arrow-down">
</span>
</span>
</span>
:
<span className="col-xs-4" onClick={ this.opposeItem.bind(this) }>
<span>
{this.state.opposeCount} oppose
<span className="glyphicon glyphicon-small glyphicon-arrow-down">
</span>
</span>
</span>
}
<span className="col-xs-4" >
<span className="glyphicon glyphicon-small glyphicon-share-alt">
</span>
&nbsp;Share
</span>
</div>
);
}
}
4 changes: 2 additions & 2 deletions src/js/components/MoreMenu.jsx
Original file line number Diff line number Diff line change
@@ -40,7 +40,7 @@ export default class MoreMenu extends Component {
</span>
}
<ul className="list-group">
<li className="list-group-item"><Link to="/more/email_ballot">Print or Email Ballot</Link></li>
{/*<li className="list-group-item"><Link to="/more/email_ballot">Print or Email Ballot</Link></li>*/}
<li className="list-group-item"><Link to="/more/opinions/followed">Opinions I'm Following</Link></li>
<li className="list-group-item"><Link to="/settings/location">My Ballot Location</Link></li>
<li className="list-group-item"><Link to="/more/sign_in">Account Settings</Link></li>
@@ -55,7 +55,7 @@ export default class MoreMenu extends Component {
<h4 className="text-left"></h4>
<ul className="list-group">
<li className="list-group-item"><Link to="/more/about">About <strong>We Vote</strong></Link></li>
<li className="list-group-item"><Link to="/more/privacy">Terms &amp; Policies</Link></li>
{/*<li className="list-group-item"><Link to="/more/privacy">Terms &amp; Policies</Link></li>*/}
<li className="list-group-item"><a href={ web_app_config.WE_VOTE_SERVER_ADMIN_ROOT_URL }
target="_blank">Admin</a></li>
{this.props.signed_in_personal ?
3 changes: 2 additions & 1 deletion src/js/config.js
Original file line number Diff line number Diff line change
@@ -16,5 +16,6 @@ module.exports = {
},

// FACEBOOK_APP_ID: '1097389196952441' // DaleMcGrew Facebook App Id, https://wevote.me
FACEBOOK_APP_ID: '868492333200013' // wevote-dev, http://localhost:3000
FACEBOOK_APP_ID: '1104012436290117' // We Vote - Test App
// FACEBOOK_APP_ID: '868492333200013' // wevote-dev, http://localhost:3000
};
117 changes: 108 additions & 9 deletions src/js/routes/Ballot/Candidate.jsx
Original file line number Diff line number Diff line change
@@ -1,12 +1,17 @@
import React, { Component, PropTypes } from 'react';
import { Button, ButtonToolbar, DropdownButton, Input, MenuItem, Navbar } from "react-bootstrap";
import { Link } from 'react-router';

import BallotActions from '../../actions/BallotActions';
import BallotStore from '../../stores/BallotStore';
import CandidateDetail from '../../components/Ballot/CandidateDetail';
import ItemActionbar from '../../components/ItemActionbar';
import ItemActionBar2 from '../../components/ItemActionBar2';
import StarAction from '../../components/StarAction';

export default class Candidate extends Component {
static propTypes = {
history: PropTypes.func.isRequired,
//history: PropTypes.func.isRequired,
params: PropTypes.object.isRequired,
};

@@ -15,16 +20,29 @@ export default class Candidate extends Component {
}

render() {
var candidate = BallotStore
.getCandidateByWeVoteId(`${this.props.params.we_vote_id}`);

var candidate = BallotStore.getCandidateByWeVoteId(`${this.props.params.we_vote_id}`);

// no candidate exists... go to ballot
if (Object.keys(candidate).length === 0)
this.props.history.replace('/ballot')
this.props.history.replace('/ballot');

var support_item;
if (this.props.support_on) {
support_item = <Link to="ballot">7 <span className="glyphicon glyphicon-small glyphicon-arrow-up"></span></Link>;
} else {
support_item = <Link to="ballot">7 <span className="glyphicon glyphicon-small glyphicon-arrow-up"></span></Link>;
}

var oppose_item;
if (this.props.oppose_on) {
oppose_item = <Link to="ballot">3 <span className="glyphicon glyphicon-small glyphicon-arrow-down"></span></Link>;
} else {
oppose_item = <Link to="ballot">3 <span className="glyphicon glyphicon-small glyphicon-arrow-down"></span></Link>;
}

return (
<div className='candidate-detail-route'>
{/*
<header className="row">
<div className="col-xs-6 col-md-6 text-center">
<Link to='/ballot'>
@@ -41,14 +59,95 @@ export default class Candidate extends Component {
</Link>
</div>
</header>
*/}

<CandidateDetail {...candidate} />
<StarAction
we_vote_id={candidate.we_vote_id}
is_starred={candidate.is_starred} />
<div className="row" style={{ paddingBottom: '10px' }}>
<div
className="col-xs-4"
style={candidate.candidate_photo_url ? {} : {height:'95px'}}>

</div>
{
candidate.candidate_photo_url ?

<img
className="img-circle"
style={{display:'block', paddingTop: '10px', width:'100px'}}
src={candidate.candidate_photo_url}
alt="candidate-photo"/> :

<i className="icon-lg icon-main icon-icon-person-placeholder-6-1 icon-light"/>

}
</div>
<div className="col-xs-8">
<h4 className="bufferNone">
<Link className="linkLight"
to={"/candidate/" + candidate.we_vote_id }
onlyActiveOnIndex={false}>
{ candidate.ballot_item_display_name }
</Link>
</h4>
<div>
{/* Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur posuere vulputate massa ut efficitur.
Duis a eros fringilla, dictum leo vitae, vulputate mi. Nunc vitae neque nec erat fermentum... (more)<br />
Courtesy of Ballotpedia.org */}
</div>
</div>
<div className="col-xs-8">
<div>Running for US House - District 12</div>
<ItemActionBar2 we_vote_id={candidate.we_vote_id}
is_support={candidate.is_support} is_oppose={candidate.is_oppose}
supportCount={candidate.supportCount} opposeCount={candidate.opposeCount} />
</div>
</div>
<div className="container-fluid well well-90">
<ul className="list-group">
<li className="list-group-item">
<div>
<input type="text" name="address" className="form-control" defaultValue="What do you think?" />
<Link to="ballot_candidate" params={{id: 2}}><Button bsSize="small">Post Privately</Button></Link>
</div>
</li>
</ul>
<ul className="list-group">
<li className="list-group-item">
<div className="row">
<div className="pull-left col-xs-2 col-md-4">
<Link to="ballot_candidate_one_org_position" params={{id: 2, org_id: 27}}>
<i className={"icon-icon-org-placeholder-6-2 icon-light"}></i>
</Link>
</div>
<div className="pull-right col-xs-10 col-md-8">
<h4 className="">
<Link className="" to="ballot_candidate_one_org_position" params={{id: 2, org_id: 27}}>
Organization Name<br />{/* TODO icon-org-placeholder */}
</Link>
</h4>
<p className="">supports <span className="small">Yesterday at 7:18 PM</span></p>
</div>
</div>
<div className="row">
Integer ut bibendum ex. Suspendisse eleifend mi accumsan, euismod enim at, malesuada nibh.
Duis a eros fringilla, dictum leo vitae, vulputate mi. Nunc vitae neque nec erat fermentum... (more)
</div>
<br />
23 Likes<br />
</li>
<li className="list-group-item">
<span className="glyphicon glyphicon-small glyphicon-tower"></span>&nbsp;Another Organization<br />{/* TODO icon-org-placeholder */}
<span>opposes</span> <span>Yesterday at 2:34 PM</span><br />
Integer ut bibendum ex. Suspendisse eleifend mi accumsan, euismod enim at, malesuada nibh.
Duis a eros fringilla, dictum leo vitae, vulputate mi. Nunc vitae neque nec erat fermentum... (more)<br />
5 Likes<br />
</li>
</ul>
</div>

</div>
);

}

_onChange () { }
}
4 changes: 2 additions & 2 deletions src/js/stores/BallotStore.js
Original file line number Diff line number Diff line change
@@ -217,14 +217,14 @@ const BallotStore = createStore({
.voterPositionRetrieve( we_vote_id )
);

} else {
} else { // Ballot item is Office

promiseQueue
.push(

BallotAPIWorker
.candidatesRetrieve ( we_vote_id )
.then( (response) => {
.then( (response) => {
var cand_list = _ballot_store [
response.office_we_vote_id
] . candidate_list = [];

0 comments on commit 4570ec5

Please sign in to comment.