House Floor Monitor
A comprehensive real-time monitoring dashboard for tracking U.S. House floor proceedings, live votes, and legislative activities with a tactical command-center interface.
Features
Live Vote Tracking
- Real-time Vote Display: Displays current vote counts (Yeas, Nays, Present) with percentages
- Live Vote Tallies: Integration with House Clerk's voting system
- Threshold Analysis: Calculates votes needed, remaining votes, and maximum possible outcomes
- Vote History: Auto-refreshes every 30 seconds for up-to-date information
House Floor Monitoring
- Session Status: Real-time display of floor session status (voting, debate, recess, prayer, pledge, oath, etc.)
- Mode Toggle: Switch between different floor activity modes (Vote, Recess, Debate, Prayer, Pledge, Silence, Oath, Speaker Pro Tempore)
- Floor Proceedings Feed: Live legislative activity updates from House Clerk
- Quorum Tracking: Monitors member attendance and quorum requirements
Chamber Visualization
- Chamber Vote Map: Circular seating visualization showing member votes by party
- Party Breakdown: Displays current party composition (Republicans, Democrats, Independents)
- Balance of Power: Shows majority control status and vacancy tracking
- Absentee Tracking: Identifies missing members from roll calls
Legislative Information
- Bill Calendar: House voting calendar showing scheduled voting days
- Bills This Week: Current bills scheduled for debate and votes
- Debate Information: Committee assignments and bill details
- Morning Prayer: Daily chaplain information and prayer details
- Speaker Pro Tempore: Current speaker information and party affiliation
Multi-Source Integration
- Live Stream: Embedded YouTube stream from US House Clerk
- Live Floor Feed: Direct video feed from House floor
- Weather Integration: Local and DC weather with Capitol camera feed
- Time Zones: Displays local time, Eastern (DC), and UTC
- Airport Delays: FAA national airspace system status
System Features
- Cloudflare Worker Integration: Server-side RSS feed processing to eliminate CORS issues
- Multiple Data Sources: Aggregates data from House Clerk, Congress.gov, FAA, and News feeds
- Dark Tactical Interface: Military command center-inspired design
- System Logs: Tracks all data fetches and system events
- Responsive Design: Works on desktop and mobile browsers
Technical Stack
- Frontend: HTML5, CSS3 (27.1%), JavaScript (59.3%)
- CSS Features: CSS Grid, CSS Custom Properties, Flexbox layouts
- Video: HLS.js for live stream playback
- Calendar: FullCalendar library for voting calendar display
- Backend: Cloudflare Workers for server-side processing
- CDN: Cloudflare for edge network deployment
Quick Start
Setup
-
Clone the repository:
git clone https://github.com/buckler-rougher/house-floor-monitor.git
cd house-floor-monitor
-
Open in browser:
# Simple file opening
open index.html
# Or using a local server
npm run dev
-
The site loads with live data by default and will display current House floor activity
Configuration
Cloudflare Worker Setup
The application uses a Cloudflare Worker to handle RSS feed processing server-side, eliminating CORS issues.
Deployment Steps
-
Install Wrangler CLI:
npm install -g wrangler
-
Login to Cloudflare:
wrangler login
-
Update Configuration:
- Edit
wrangler.toml and replace your-subdomain with your Cloudflare subdomain
- Edit
app.js and update worker URLs in RSS_CONFIG and NEWS_CONFIG
-
Deploy Worker:
npm run deploy-worker
-
Update Client URLs:
In app.js, update these configuration sections:
const RSS_CONFIG = {
workerUrl: 'https://your-worker-subdomain.workers.dev/api/proceedings',
refreshInterval: 120000
};
const NEWS_CONFIG = {
workerUrl: 'https://your-worker-subdomain.workers.dev/api/news',
refreshInterval: 300000
};
API Endpoints
/api/proceedings - House floor proceedings with relative timestamps/api/news - Latest news from multiple RSS feeds/api/health - Worker health status
Customization
Modify Refresh Intervals
Edit configuration objects in app.js:
API_CONFIG.refreshInterval = 30000; // milliseconds
Adjust Theme Colors
Modify CSS variables in styles.css:
--bg-primary: Main background color
--bg-secondary: Secondary background
--text-primary: Main text color
--text-secondary: Secondary text
--accent-green: Success indicators
--accent-amber: Warnings
--accent-red: Errors
--party-dem: Democratic party color
--party-rep: Republican party color
Data Sources
House Proceedings
Weather & Location
News
Browser Compatibility
Works in all modern browsers that support:
- ES6+ JavaScript
- CSS Grid and Flexbox
- CSS Custom Properties
- HTML5 Video elements
- Fetch API
Tested on:
- Chrome/Chromium 90+
- Firefox 88+
- Safari 14+
- Edge 90+
File Structure
Four directories that are easy to confuse, told apart by where the code runs:
| Runs | |
|---|
lib/ | the browser, and the Worker | Shared modules. Loaded by both boards with <script defer>, and three of them (bill-id, floor-speaker, floor-status) are also imported by worker.js, so the same rules apply on the page and at the edge. They assign to globalThis rather than exporting, which is what lets one file do both. |
functions/ | Cloudflare Pages, at the edge | Pages Functions. One file: _middleware.js, which rewrites senate-floor.evanhollander.org/ to /senate.html so both boards live in one Pages project. A rewrite, not a redirect, because the hostname has to stay in the address bar. Load-bearing, despite being 30 lines. |
test/ | your machine, on demand | Automated and asserted. npm test runs all five, no network and no dependencies. The large files beside them are fixtures, deliberately verbatim. |
dev/ | your machine, by hand | Investigation tooling. Nothing here is asserted and nothing runs in CI. The exception is harness.js, which the page itself loads in dev mode. See dev/README.md. |
worker.js is a separate Cloudflare Worker on api.evanhollander.org, not a
Pages Function; functions/ and worker.js are two different runtimes.
lib/crec.js has no production consumer. It grades speaker attribution against
the Congressional Record and is reached only by test/crec.test.js and
dev/grade.mjs.
house-floor-monitor/
├── index.html # House board
├── senate.html # Senate board, served at senate-floor.* by functions/
├── app.js # House board logic
├── senate.js # Senate board logic — deliberately not app.js
├── styles.css # Both boards: the source. Edit this.
├── styles.house.css # GENERATED (npm run css): styles.css without comments; the House loads it
├── styles.senate.css # GENERATED (npm run css): also without the rules the Senate page cannot use
├── worker.js # The API Worker (api.evanhollander.org)
├── lib/ # Shared modules (browser + Worker)
├── functions/ # Pages middleware
├── test/ # npm test
├── dev/ # Off-network harness and probes
├── committees/ # Committee seals
├── wrangler.toml # Worker configuration
└── README.md # This file
Development
Local development server
npm run dev
Serves the repo on port 3456. API calls from localhost fail CORS against the
production Worker, so use the dev harness to render off-network:
npm run dev # then open http://localhost:3456/?fixtures
Tests
npm test
Deploying
Push to main. Cloudflare's Git integration deploys the Pages site and the
Worker together; there is no deploy command to run, and wrangler deploy is not
the path this project uses.
License
MIT License - Feel free to modify and use as needed.
Contributing
This project tracks live House floor activity. Contributions, suggestions, and improvements are welcome. Feel free to open issues or submit pull requests.
Disclaimer
This is an independent project and is not affiliated with the U.S. House of Representatives. All data is sourced from public APIs and feeds. For official information, please visit house.gov.
