Micah Lee micah@eff.org @micahflee Web Developer at Electronic Frontier Foundation https://www.eff.org/
What's the Electronic Frontier Foundation?
What's the Electronic Frontier Foundation? ● US-based non-profit ● Issues include: full of lawyers, – Free Speech technologists and – Fair Use activists – Privacy ● Focuses on digital – Security civil liberties – DRM – Internet Freedom ● We've been using – Jailbreaking and loving CiviCRM – Encryption, anonymity, since October 2011 etc.
EFF Has Special Needs ● Membership logic is crazy ● The same premiums are offered at various prices ● We make tons of donate pages for different purposes ● Donate pages must be cached ● Design and simplicity are very important ● PCI Compliance is obnoxious
TODO: Membership Levels screenshot
Some Hacks We Had in Place ● Three versions of every membership type (one-time, recurring, variable price) – Total of 17 membership types in CiviCRM ● Three versions of every premium (one-time, recurring, variable price) – We have 7 different premiums – But we store 21 different premiums in CiviCRM
Too much traffic, too little caching ● On each CiviCRM contribution page load: – Loads Drupal into memory – Loads CiviCRM into memory – Takes lots of server resources – Takes lots of time ● EFF's popular action alerts get 30,000 signatures – 30,000 signatures = 30,000 thank you page loads = 30,000 Drupals and CiviCRMs loaded into memory (~240 gigabytes of RAM?) – 1 crashed web server :( ● Caching solves this problem
Lots of Donate Pages ● We want to know contribution sources , but we don't track email clicks for privacy reasons ● We used to have separate donate and join pages ● We used to have four versions of each contribution page: Donate, Donate PayPal, Join, Join PayPal (CiviCRM 4.2 fixes this, yay!) ● We create a new donate page for each: – Fund-raising campaign about a specific issue – Fund-raising appeal email – Action alert thank you page
Ugly Hacks ● Way too many custom templates ● Hundreds of Drupal URL aliases ● Stupidly complicated node id in URL ● Hooks, hooks, hooks! ● Tons of custom JavaScript that changes everything – But horrible experience for NoScripters ● Skip confirmation page hack (now in CiviCRM 4.2!) ● I spoke about this at CiviCon SF in April 2012
TODO: HTTPS Everywhere page screenshot
Farewell, Authorize.net ● If you accept Authorize.net, you have to be PCI complaint (and pay auditors tons of money to find security false positives with automated tools) ● Authorize.net refuses to fix their bugs, even after we spend hours on the phone with them explaining their problem and how they can fix it (just ask Leez) ● We wanted better rates, better customer service, better development environment
Hello, Stripe!
Note about Stripe ● We're now using Stripe on our donate pages! ● Joshua Walker (drastik) recently wrote a CiviCRM Stripe payment processor http://civicrm.org/extensions/stripe-payment-processor ● It's brand new! (we still need to test it) ● Our online store uses Ubercart, with no good Stripe module yet (we're working on it) ● They have run fun hacker challenges, just google for “stripe ctf”
So we decided to REINVENT THE WHEEL (sort of)
Donate Pages Outside of CiviCRM?! ● If we build our own system – We have 100% control over look and feel – We can cache our donate pages so they can sit behind load balancers , reverse proxies , content delivery networks , clusters galore ! (we don't actually do all of this, but it's nice that it's an option) ● CiviCRM has a great API – Easy to push contributions into the database – We can go crazy with membership logic – Premiums however we want them ? Sure.
I find this chart confusing, but those numbers are in millions USD!
http://wiki.creativecommons.org/Single_click_donations_with_CiviCRM (thanks, nkinkade!)
What We Came Up With ● Creative Common's OneClick code , heavily hacked, customized, and added Stripe support ● Drupal content types: Donate Page , Premium ● Custom panels panes defined in code, including donate form that displays, validates, and hooks into OneClick ● Panels node_view variants : Donate Page, Action Alert Thank You Donate Page ● Lots of JavaScript, CSS, and images
Donate Page
Action Alert Thank You Page
Thanks For Donating / Tweet
Editing Donate Pages
Endorsement
Editing Premiums
Panels
NoScript
Demo Time Open browser and show off all the fancy JavaScript
Recommend
More recommend