From 0e809d0c455764c6fe72faf3e76069d29a2ddecd Mon Sep 17 00:00:00 2001
From: tobinbradley <tobin.bradley@gmail.com>
Date: Tue, 27 Oct 2015 12:43:04 -0400
Subject: [PATCH] Responsive columns

Added a col-responsive class so table columns can hide themselves on
tiny screns. Also pointed some services to different endpoints.
---
 app/css/reports.css           |   8 ++
 app/index.html                |   4 +-
 app/js/modules/environment.js |   8 +-
 app/js/modules/impervious.js  |  10 +--
 app/js/modules/library.js     |  10 +--
 app/js/modules/parks.js       |   9 +-
 app/js/modules/property.js    |  36 ++++----
 app/js/modules/search.js      |   5 +-
 app/js/modules/trash.js       |  12 +--
 app/js/modules/voting.js      | 158 +++++++++++++++++-----------------
 10 files changed, 127 insertions(+), 133 deletions(-)

diff --git a/app/css/reports.css b/app/css/reports.css
index 2f374a9..772b9e1 100644
--- a/app/css/reports.css
+++ b/app/css/reports.css
@@ -1,6 +1,14 @@
 .report-container {
   padding: 32px;
 }
+@media (max-width: 500px) {
+    .report-container {
+        padding: 15px;
+    }
+    .col-responsive {
+        display: none;
+    }
+}
 
 /*tables*/
 .report-container table {
diff --git a/app/index.html b/app/index.html
index 2ee4c71..c5039ce 100644
--- a/app/index.html
+++ b/app/index.html
@@ -60,11 +60,11 @@
 			</header>
 			<nav class="navigation mdl-navigation mdl-color--blue-grey-800">
 				<a class="mdl-navigation__link active" data-type="property" href="javascript:void(0)"><i class="mdl-color-text--blue-grey-400 icon icon-home" role="presentation"></i>Property</a>
+				<a class="mdl-navigation__link" data-type="schools" href="javascript:void(0)"><i class="mdl-color-text--blue-grey-400 icon icon-school" role="presentation"></i>Schools</a>
 				<a class="mdl-navigation__link" data-type="trash" href="javascript:void(0)"><i class="mdl-color-text--blue-grey-400 icon icon-trash" role="presentation"></i>Trash and Recycling</a>
-                <a class="mdl-navigation__link" data-type="schools" href="javascript:void(0)"><i class="mdl-color-text--blue-grey-400 icon icon-school" role="presentation"></i>Schools</a>
-                <a class="mdl-navigation__link" data-type="voting" href="javascript:void(0)"><i class="mdl-color-text--blue-grey-400 icon icon-check" role="presentation"></i>Voting</a>
 				<a class="mdl-navigation__link" data-type="environment" data-layers="postgis:view_regulated_floodplains,postgis:water_quality_buffers" href="javascript:void(0)"><i class="mdl-color-text--blue-grey-400 icon icon-droplet" role="presentation"></i>Environment</a>
 				<a class="mdl-navigation__link" data-type="impervious" data-layers="impervious_surface" href="javascript:void(0)"><i class="mdl-color-text--blue-grey-400 icon icon-rain-1" role="presentation"></i>Impervious Surface</a>
+				<a class="mdl-navigation__link" data-type="voting" href="javascript:void(0)"><i class="mdl-color-text--blue-grey-400 icon icon-check" role="presentation"></i>Voting</a>								
 				<a class="mdl-navigation__link" data-type="parks" href="javascript:void(0)"><i class="mdl-color-text--blue-grey-400 icon icon-tree-2" role="presentation"></i>Parks</a>
                 <a class="mdl-navigation__link" data-type="libraries" href="javascript:void(0)"><i class="mdl-color-text--blue-grey-400 icon icon-library" role="presentation"></i>Libraries</a>
 				<div class="mdl-layout-spacer"></div>
diff --git a/app/js/modules/environment.js b/app/js/modules/environment.js
index f7fecd4..510e933 100644
--- a/app/js/modules/environment.js
+++ b/app/js/modules/environment.js
@@ -183,14 +183,14 @@ var WaterQualityComponent = React.createClass({
                     </div>
                 );
             }
-		}
+        }
 
-		return (
+        return (
 			<div>
 			{returnVal}
 			</div>
 		);
-	}
+    }
 });
 
 
@@ -237,7 +237,7 @@ var SoilComponent = React.createClass({
 			{returnVal}
 			</div>
 		);
-	}
+    }
 });
 
 
diff --git a/app/js/modules/impervious.js b/app/js/modules/impervious.js
index 76caba7..dccf9bb 100644
--- a/app/js/modules/impervious.js
+++ b/app/js/modules/impervious.js
@@ -19,13 +19,13 @@ var ImperviousInfo = React.createClass({
     },
     getImpervious: function(pid) {
         var args = {
-            'table': 'impervious_surface_area',
-            'fields': 'sum(sum_of_area) as area, subtheme',
-            'parameters': `commonpid='${pid}' group by subtheme`,
-            'order': 'subtheme'
+            'columns': 'sum(sum_of_area) as area, subtheme',
+            'filter': `commonpid='${pid}'`,
+            'sort': 'subtheme',
+            'group': 'subtheme'
         };
         httpplease = httpplease.use(jsonresponse);
-        httpplease.get('http://maps.co.mecklenburg.nc.us/rest/v4/ws_geo_attributequery.php' + objectToURI(args),
+        httpplease.get('http://maps.co.mecklenburg.nc.us/api/query/v1/impervious_surface_area' + objectToURI(args),
             function(err, res) {
                 this.setState({ theImpervious: res.body });
             }.bind(this)
diff --git a/app/js/modules/library.js b/app/js/modules/library.js
index 1469ef5..625ee74 100644
--- a/app/js/modules/library.js
+++ b/app/js/modules/library.js
@@ -20,16 +20,12 @@ var LibraryInfo = React.createClass({
     },
     getLibraries: function(lat, lng) {
         var args = {
-            'x': lng,
-            'y': lat,
-            'srid': 4326,
-            'table': 'libraries',
-            'geometryfield': 'the_geom',
-            'fields': 'name, address, city, st_x(st_transform(the_geom, 4326)) as lng, st_y(st_transform(the_geom, 4326)) as lat',
+            'geom_column': 'the_geom',
+            'columns': 'name, address, city, st_x(st_transform(the_geom, 4326)) as lng, st_y(st_transform(the_geom, 4326)) as lat',
             'limit': '6'
         };
         httpplease = httpplease.use(jsonresponse);
-        httpplease.get('http://maps.co.mecklenburg.nc.us/rest/v2/ws_geo_nearest.php' + objectToURI(args),
+        httpplease.get(`http://maps.co.mecklenburg.nc.us/api/nearest/v1/libraries/${lng},${lat}/4326` + objectToURI(args),
             function(err, res) {
                 this.setState({ theLibraries: res.body });
             }.bind(this)
diff --git a/app/js/modules/parks.js b/app/js/modules/parks.js
index 69b277b..455def1 100644
--- a/app/js/modules/parks.js
+++ b/app/js/modules/parks.js
@@ -20,16 +20,11 @@ var ParkInfo = React.createClass({
     },
     getParks: function(lat, lng) {
         var args = {
-            'x': lng,
-            'y': lat,
-            'srid': 4326,
-            'table': 'parks_all',
-            'geometryfield': 'geom',
-            'fields': 'name, address, city, st_x(st_transform(geom, 4326)) as lng, st_y(st_transform(geom, 4326)) as lat',
+            'columns': 'name, address, city, st_x(st_transform(geom, 4326)) as lng, st_y(st_transform(geom, 4326)) as lat',
             'limit': '6'
         };
         httpplease = httpplease.use(jsonresponse);
-        httpplease.get('http://maps.co.mecklenburg.nc.us/rest/v2/ws_geo_nearest.php' + objectToURI(args),
+        httpplease.get(`http://maps.co.mecklenburg.nc.us/api/nearest/v1/parks_all/${lng},${lat}/4326` + objectToURI(args),
             function(err, res) {
                 this.setState({ theParks: res.body });
             }.bind(this)
diff --git a/app/js/modules/property.js b/app/js/modules/property.js
index dc68634..0237e05 100644
--- a/app/js/modules/property.js
+++ b/app/js/modules/property.js
@@ -197,8 +197,8 @@ var AppraisalClass = React.createClass({
                         <tr>
                             <th className="mdl-data-table__cell--non-numeric">Year</th>
                             <th>Building</th>
-                            <th>Land</th>
-                            <th>Extra</th>
+                            <th className="col-responsive">Land</th>
+                            <th className="col-responsive">Extra</th>
                             <th>Total</th>
                         </tr>
                     </thead>
@@ -213,10 +213,10 @@ var AppraisalClass = React.createClass({
                                         <td>
                                             {this.money(object.building_value)}
                                         </td>
-                                        <td>
+                                        <td className="col-responsive">
                                             {this.money(object.land_value)}
                                         </td>
-                                        <td>
+                                        <td className="col-responsive">
                                             {this.money(object.extra_features_value)}
                                         </td>
                                         <td>
@@ -254,8 +254,8 @@ var SalesClass = React.createClass({
                         <tr>
                             <th className="mdl-data-table__cell--non-numeric">Date</th>
                             <th>Price</th>
-                            <th className="mdl-data-table__cell--non-numeric">Deed Book</th>
-                            <th className="mdl-data-table__cell--non-numeric">Legal Reference</th>
+                            <th className="mdl-data-table__cell--non-numeric col-responsive">Deed Book</th>
+                            <th className="mdl-data-table__cell--non-numeric col-responsive">Legal Reference</th>
                         </tr>
                     </thead>
                     <tbody>
@@ -269,10 +269,10 @@ var SalesClass = React.createClass({
                                         <td>
                                             {this.money(Number(object.sale_price).toFixed(0))}
                                         </td>
-                                        <td className="mdl-data-table__cell--non-numeric">
+                                        <td className="mdl-data-table__cell--non-numeric col-responsive">
                                             {object.deed_book}
                                         </td>
-                                        <td className="mdl-data-table__cell--non-numeric">
+                                        <td className="mdl-data-table__cell--non-numeric col-responsive">
                                             {object.legal_reference}
                                         </td>
                                     </tr>
@@ -301,7 +301,7 @@ var LandUseClass = React.createClass({
                         <tr>
                             <th className="mdl-data-table__cell--non-numeric">Use</th>
                             <th>Units</th>
-                            <th className="mdl-data-table__cell--non-numeric">Neighborhood</th>
+                            <th className="mdl-data-table__cell--non-numeric col-responsive">Neighborhood</th>
                         </tr>
                     </thead>
                     <tbody>
@@ -315,7 +315,7 @@ var LandUseClass = React.createClass({
                                         <td>
                                             {Number(object.units).toFixed(0)}
                                         </td>
-                                        <td className="mdl-data-table__cell--non-numeric">
+                                        <td className="mdl-data-table__cell--non-numeric col-responsive">
                                             {object.neighborhood}
                                         </td>
                                     </tr>
@@ -351,10 +351,10 @@ var BuildingsClass = React.createClass({
                         <tr>
                             <th className="mdl-data-table__cell--non-numeric">Structure</th>
                             <th>Year Built</th>
-                            <th className="mdl-data-table__cell--non-numeric">Exterior</th>
+                            <th className="mdl-data-table__cell--non-numeric col-responsive">Exterior</th>
                             <th className="mdl-data-table__cell--non-numeric">Area</th>
-                            <th>Beds</th>
-                            <th>Baths</th>
+                            <th className="col-responsive">Beds</th>
+                            <th className="col-responsive">Baths</th>
                         </tr>
                     </thead>
                     <tbody>
@@ -368,16 +368,16 @@ var BuildingsClass = React.createClass({
                                         <td>
                                             {object.year_built}
                                         </td>
-                                        <td className="mdl-data-table__cell--non-numeric">
+                                        <td className="mdl-data-table__cell--non-numeric col-responsive">
                                             {object.exterior_wall_description}
                                         </td>
                                         <td>
                                             {this.commafy(object.total_square_feet)} ft<sup>2</sup>
                                         </td>
-                                        <td>
+                                        <td className="col-responsive">
                                             {object.bedrooms}
                                         </td>
-                                        <td>
+                                        <td className="col-responsive">
                                             {Number(object.full_baths) + Number(object.three_quarter_baths) + Number(object.half_baths)}
                                         </td>
                                     </tr>
@@ -414,7 +414,7 @@ var PermitsClass = React.createClass({
                         <tr>
                             <th className="mdl-data-table__cell--non-numeric">Year</th>
                             <th className="mdl-data-table__cell--non-numeric">Project</th>
-                            <th>Area</th>
+                            <th className="col-responsive">Area</th>
                             <th>Cost</th>
                         </tr>
                     </thead>
@@ -429,7 +429,7 @@ var PermitsClass = React.createClass({
                                         <td className="mdl-data-table__cell--non-numeric">
                                             {object.project_name}
                                         </td>
-                                        <td>
+                                        <td className="col-responsive">
                                             {this.commafy(object.square_footage)} ft<sup>2</sup>
                                         </td>
                                         <td>
diff --git a/app/js/modules/search.js b/app/js/modules/search.js
index 35d973f..73c863d 100644
--- a/app/js/modules/search.js
+++ b/app/js/modules/search.js
@@ -22,11 +22,10 @@ var SearchTemplate = React.createClass({
         this.timer = this.setTimeout( function() {
             if (query.trim().length >= 3) {
                 var args = {
-                    'searchtypes': 'address,park,library,school,pid,business',
-                    'query': query
+                    'tables': 'address,park,library,school,pid,business'
                 };
                 httpplease = httpplease.use(jsonresponse);
-                httpplease.get('http://maps.co.mecklenburg.nc.us/rest/v5/ws_geo_ubersearch.php' + objectToURI(args),
+                httpplease.get(`http://maps.co.mecklenburg.nc.us:80/api/search/v1/${query}` + objectToURI(args),
                     function(err, data) {
                         this.setState({ searchData: data.body });
                     }.bind(this)
diff --git a/app/js/modules/trash.js b/app/js/modules/trash.js
index 9e31453..fafd52f 100644
--- a/app/js/modules/trash.js
+++ b/app/js/modules/trash.js
@@ -23,15 +23,11 @@ var TrashInfo = React.createClass({
     },
     getTrash: function(lat, lng) {
         var args = {
-            'x': lng,
-            'y': lat,
-            'srid': 4326,
-            'table': 'solid_waste',
-            'geometryfield': 'the_geom',
-            'fields': 'jurisdiction, day, week, type'
+            'geom_column': 'the_geom',
+            'columns': 'jurisdiction, day, week, type'
         };
         httpplease = httpplease.use(jsonresponse);
-        httpplease.get('http://maps.co.mecklenburg.nc.us/rest/v3/ws_geo_pointoverlay.php' + objectToURI(args),
+        httpplease.get(`http://maps.co.mecklenburg.nc.us:80/api/intersect_point/v1/solid_waste/${lng},${lat}/4326` + objectToURI(args),
             function(err, res) {
                 this.setState({ theTrash: res.body });
             }.bind(this)
@@ -145,7 +141,7 @@ var TrashInfo = React.createClass({
                                         <i className="icon icon-recycle" role="presentation"></i>
                                         <h2>Your RECYCLING day is</h2>
                                         <h1>{recycling[0].day.toUpperCase()} {this.recyclingWeek(recycling[0].week)}</h1>
-                                        <h4>Recycling pickup is every other week.</h4>
+                                        <h4>Recycling pickup is every other week ({recycling[0].week})</h4>
                                     </div>
                                 </div>
                             </div>
diff --git a/app/js/modules/voting.js b/app/js/modules/voting.js
index 48ee38f..fb42cd8 100644
--- a/app/js/modules/voting.js
+++ b/app/js/modules/voting.js
@@ -10,7 +10,7 @@ var PollingComponent = React.createClass({
             recs: ''
         };
     },
-	convertDistance: function(dist) {
+    convertDistance: function(dist) {
         return (dist / 5280).toFixed(1) + ' miles';
     },
     handleLocationClick: function(event) {
@@ -19,11 +19,11 @@ var PollingComponent = React.createClass({
             addtmpMarker(theItem.getAttribute('data-lat'), theItem.getAttribute('data-lng'), theItem.getAttribute('data-label'), theItem.getAttribute('data-address'));
         }
     },
-	render: function() {
+    render: function() {
         var returnVal;
 
-		if (typeof this.props.recs === 'object' && this.props.recs.length !== 0) {
-			returnVal = (
+        if (typeof this.props.recs === 'object' && this.props.recs.length !== 0) {
+            returnVal = (
 				<div className="report-record-highlight">
 					<i className="icon icon-check" role="presentation"></i>
 					<h2>Your Polling Location is</h2>
@@ -37,38 +37,38 @@ var PollingComponent = React.createClass({
 					<h4>Precinct {this.props.recs[0].precinct}</h4>
 				</div>
 			);
-		}
+        }
 
-		return (
+        return (
 			<div>
 			{returnVal}
 			</div>
 		);
-	}
+    }
 });
 
 var RepresentativeComponent = React.createClass({
-	getDefaultProps: function() {
+    getDefaultProps: function() {
         return {
             recs: '',
-			type: ''
+            type: ''
         };
     },
-	render: function() {
-		var returnVal;
+    render: function() {
+        var returnVal;
 
-		if (typeof this.props.recs === 'object' && this.props.recs.length !== 0) {
-			var atLargeText = '';
-			var atLarge = this.props.recs.slice(0);
+        if (typeof this.props.recs === 'object' && this.props.recs.length !== 0) {
+            var atLargeText = '';
+            var atLarge = this.props.recs.slice(0);
 
-			atLarge.shift();
-			atLarge = atLarge.map(function(item) { return item.representative; });
+            atLarge.shift();
+            atLarge = atLarge.map(function(item) { return item.representative; });
 
-			if ( atLarge.length > 0 ) {
-				atLargeText = 'At Large: ' + atLarge.join(', ');
-			}
+            if ( atLarge.length > 0 ) {
+                atLargeText = 'At Large: ' + atLarge.join(', ');
+            }
 
-			returnVal = (
+            returnVal = (
 				<div className="report-record-highlight">
 					<i className="icon icon-user" role="presentation"></i>
 					<h2>Your {this.props.type} Representative is</h2>
@@ -77,25 +77,25 @@ var RepresentativeComponent = React.createClass({
 					<h4>{atLargeText}</h4>
 				</div>
 			);
-		}
+        }
 
-		return (
+        return (
 			<div>
 			{returnVal}
 			</div>
 		);
-	}
+    }
 });
 
 var SenateComponent = React.createClass({
-	getDefaultProps: function() {
+    getDefaultProps: function() {
         return {
             recs: ''
         };
     },
-	render: function() {
-		var returnVal;
-		if (typeof this.props.recs === 'object' && this.props.recs.length !== 0) {
+    render: function() {
+        var returnVal;
+        if (typeof this.props.recs === 'object' && this.props.recs.length !== 0) {
             returnVal = (
 				<div className="report-record-highlight">
 					<i className="icon icon-user" role="presentation"></i>
@@ -103,18 +103,18 @@ var SenateComponent = React.createClass({
 					<h1>{this.props.recs[0].representative} <br /> {this.props.recs[1].representative}</h1>
 				</div>
 			);
-		}
-		return (
+        }
+        return (
 			<div>
 			{returnVal}
 			</div>
 		);
-	}
+    }
 });
 
 
 var VotingComponent = React.createClass({
-	propTypes: {
+    propTypes: {
         lat: React.PropTypes.number.isRequired,
         lng: React.PropTypes.number.isRequired
     },
@@ -127,80 +127,80 @@ var VotingComponent = React.createClass({
     componentWillReceiveProps: function(nextProps) {
         this.getData(nextProps.lat, nextProps.lng);
     },
-	getData: function(lat, lng) {
-		this.getPollingLocation(lat, lng);
-		this.getDistrict(lat, lng, 'national_congressional', 'national_congressional', 'natCongress', 'district');
-		this.getNationalSenate();
-		this.getDistrict(lat, lng, 'state_senate', 'state_senate', 'stateSenate', 'senate');
-		this.getDistrict(lat, lng, 'state_house', 'state_house', 'stateHouse', 'house');
-		this.getDistrict(lat, lng, 'county_commission', 'voting_precincts', 'countyCommission', 'cc');
-		this.getDistrict(lat, lng, 'board_of_education', 'voting_precincts', 'countySchool', 'school');
-		this.getDistrict(lat, lng, 'charlotte_city_council', 'city_council', 'cityCharlotte', 'citydist');
-	},
-	getPollingLocation: function(lat, lng) {
+    getData: function(lat, lng) {
+        this.getPollingLocation(lat, lng);
+        this.getDistrict(lat, lng, 'national_congressional', 'national_congressional', 'natCongress', 'district');
+        this.getNationalSenate();
+        this.getDistrict(lat, lng, 'state_senate', 'state_senate', 'stateSenate', 'senate');
+        this.getDistrict(lat, lng, 'state_house', 'state_house', 'stateHouse', 'house');
+        this.getDistrict(lat, lng, 'county_commission', 'voting_precincts', 'countyCommission', 'cc');
+        this.getDistrict(lat, lng, 'board_of_education', 'voting_precincts', 'countySchool', 'school');
+        this.getDistrict(lat, lng, 'charlotte_city_council', 'city_council', 'cityCharlotte', 'citydist');
+    },
+    getPollingLocation: function(lat, lng) {
         var args = {
-                    'x': lng,
-                    'y': lat,
-                    'srid': 4326,
-                    'table': 'polling_locations,voting_precincts',
-                    'geometryfield': 'the_geom',
-					'limit': 1,
-                    'fields': `polling_locations.name as label,polling_locations.address,a.precno as precinct,st_x(st_transform(polling_locations.the_geom, 4326)) as lng, st_y(st_transform(polling_locations.the_geom, 4326)) as lat, ST_Distance(polling_locations.the_geom,ST_Transform(GeomFromText('POINT(${lng} ${lat})',4326), 2264)) as distance`,
-                    'parameters': 'a.precno = polling_locations.precno'
-                    };
+            'x': lng,
+            'y': lat,
+            'srid': 4326,
+            'table': 'polling_locations,voting_precincts',
+            'geometryfield': 'the_geom',
+            'limit': 1,
+            'fields': `polling_locations.name as label,polling_locations.address,a.precno as precinct,st_x(st_transform(polling_locations.the_geom, 4326)) as lng, st_y(st_transform(polling_locations.the_geom, 4326)) as lat, ST_Distance(polling_locations.the_geom,ST_Transform(GeomFromText('POINT(${lng} ${lat})',4326), 2264)) as distance`,
+            'parameters': 'a.precno = polling_locations.precno'
+        };
         httpplease = httpplease.use(jsonresponse);
         httpplease.get('http://maps.co.mecklenburg.nc.us/rest/v2/ws_geo_pointoverlay.php' + objectToURI(args),
             function(err, res) {
-				this.setState({ pollingRecs: res.body });
+                this.setState({ pollingRecs: res.body });
             }.bind(this)
         );
     },
     getNationalSenate: function() {
         var args = {
-                    'table': 'elected_officials',
-                    'fields': 'representative',
-                    'parameters': "district_type = 'national_senate'"
-                };
+            'table': 'elected_officials',
+            'fields': 'representative',
+            'parameters': `district_type = 'national_senate'`
+        };
         httpplease = httpplease.use(jsonresponse);
         httpplease.get('http://maps.co.mecklenburg.nc.us/rest/v4/ws_geo_attributequery.php' + objectToURI(args),
             function(err, res) {
-				this.setState({ natSenate: res.body });
+                this.setState({ natSenate: res.body });
             }.bind(this)
         );
     },
-	getDistrict: function(lat, lng, type, layer, theState, distField) {
+    getDistrict: function(lat, lng, type, layer, theState, distField) {
         var args = {
-                    'x': lng,
-                    'y': lat,
-                    'srid': 4326,
-                    'table': `elected_officials,${layer}`,
-                    'geometryfield': 'the_geom',
-                    'fields': 'elected_officials.district, elected_officials.representative',
-					'order': 'elected_officials.district',
-                    'parameters': `elected_officials.district_type = '${type}' and (elected_officials.district = 'At-Large' or elected_officials.district = cast(a.${distField} as varchar(5)))`
-                    };
+            'x': lng,
+            'y': lat,
+            'srid': 4326,
+            'table': `elected_officials,${layer}`,
+            'geometryfield': 'the_geom',
+            'fields': 'elected_officials.district, elected_officials.representative',
+            'order': 'elected_officials.district',
+            'parameters': `elected_officials.district_type = '${type}' and (elected_officials.district = 'At-Large' or elected_officials.district = cast(a.${distField} as varchar(5)))`
+        };
         httpplease = httpplease.use(jsonresponse);
         httpplease.get('http://maps.co.mecklenburg.nc.us/rest/v2/ws_geo_pointoverlay.php' + objectToURI(args),
             function(err, res) {
-				this.setState({ [theState]: res.body });
+                this.setState({ [theState]: res.body });
             }.bind(this)
         );
     },
-	render: function() {
-		var moreInfo;
+    render: function() {
+        var moreInfo;
 
-		if (typeof this.state.pollingRecs === 'object') {
-			moreInfo = (
+        if (typeof this.state.pollingRecs === 'object') {
+            moreInfo = (
 				<div className="report-moreinfo mdl-typography--text-left">
-	                <h5>For more information, please visit:</h5>
-	                <ul className="list-unstyled">
-	                    <li><a href="http://www.meckboe.org/" target="_blank">Mecklenburg County Board of Elections</a></li>
-	                </ul>
+                    <h5>For more information, please visit:</h5>
+                    <ul className="list-unstyled">
+                        <li><a href="http://www.meckboe.org/" target="_blank">Mecklenburg County Board of Elections</a></li>
+                    </ul>
 				</div>
 			);
-		}
+        }
 
-		return (
+        return (
 			<div>
 				<div className="mdl-typography--text-center">
 					<PollingComponent recs={this.state.pollingRecs} />
@@ -236,7 +236,7 @@ var VotingComponent = React.createClass({
 				{moreInfo}
 			</div>
 		);
-	}
+    }
 });
 
 module.exports = VotingComponent;