Energy Wars Display

Details the infrastructure we're using for Energy Wars.

RPNL

Currently, this is how we're getting data from RPNL.

1. RPNL sends an email containing CSV to testcs128@cs.earlham.edu
2. testcs128 forwards it to ghcrows13@cs.earlham.edu in its .forward file
3. ghcrows13@cs.earlham.edu executes mail.py (in home directory) from its .forward file
4. mail.py scrapes off CSV attachments
5. mail.py pipes text into parse.py
6. parse.py scrapes off data, copies tmp.csv to ghcrows13@proto.cs.earlham.edu:/home/users/energy/contest/daily/tmp.csv
   • uses RSA keys to bypass passwords
   • user names must be the same for RSA keys to work
7. parse.py executes a sql command that pipes this csv file into /home/users/energy/contest/daily/parse_houses.py
8. parse_houses.py strips off csv data (again!) and derives the energy change
9. parse_houses.py then copies the data into the electrical_energy_rpnl database

Display

The display is written using google charts.

Data

Overview

• Data is generated by ~energy/contest/daily/execute.bash
  • executed daily by energy's crontab
• Temporary csv files are stored in ~energy/contest/daily/tmp_data/
  • useful for desktop testing
• final csv files are stored in ~energy/public_html/development/EnergyWars/
• execute.bash has some options that you can change, including:
  • start and end dates for the baseline and the contest
  • the target database
  • name -- the prefix for CSV files
  • street -- that's the string that RPNL uses

Specifics

• execute.bash generates the daily, baseline, cumulative, and cumulative baseline
• each of these are a different .bash script
• it does this for buildings, national road, and college avenue
• an overview of what each script does:
  1. generates appropriate file names
  2. executes a dynamic SQL statement that's based on arguments
  3. stores the SQL response in a file
  4. reformats the data using ~energy/contest/daily/reformat.py
  5. stores the reformatted data in ~energy/contest/daily/tmp_data/
  6. copies the reformatted data to the destination

JavaScript

• the javascript isn't as organized as it could be
• visualization.js contains functions that create objects (charts)
• css.js contains functions for manipulating the classes of HTML objects
• chart.js, NationalRoad.js, and CollegeAvenue.js are very similar
  1. download daily power readings
  2. download baseline power readings
  3. create container object hip.data.building for building names, baselines, and power
  4. create a new dashboard with appropriate options
  5. download cumulative power readings
  6. download cumulative baseline power readings
  7. create container object hip.data.building for building names, baselines, and power
  8. create a new dashboard with appropriate options
  9. set the window resize function to redraw the chart
  10. draw the chart and intialize buttons
  • setDisplay() changes which buildings are enabled
  • setViewInterval() is for previous week / next week
  • flipViewZoom() is for zooming in / out
• gc_zoom.js changes the interval to switch between zoomed in / zoomed out
• global.js is used to intialize global namespaces and variables
• html_helper has a bunch of functions for getting and modifying the html
  • used to emulate buttons
• interval.js controls what interval is displayed
  • it's just an iterator
  • provides functions for changing instantly or gradually
  • can have its state stored/restored
  • can setView() to the interval
• hip.js contains:
  • get csv / csv to array functions
  • the animation class (for setting a chart's animation to a preset)
  • dashboard creator for this project
  • building container class

HTML

• the order in which javascript files are included is important
• make_chart() is executed on start up
• the display_buttons are generated in code
• column 2
  • contains dashboard and chart
    • date_slider has to exist; it's a bug
    • not sure about cumulative
  • menubar contains the previous/zoom/next buttons
• column 3
  • contains the cumulative dashboard and chart

CSS

It's magic.