Merge pull request #4671 from gratipay/video-etc

Video, etc.

js/gratipay/homepage.js

@@ -5,11 +5,6 @@ Gratipay.homepage.initForm = function(clientAuthorization) {
     self.$form = $('#homepage #content form');
     self.$submit = self.$form.find('button[type=submit]');
 
-    $('a.what-why').click(function(e) {
-        e.preventDefault();
-        $('#what-why').slideToggle();
-    });
-
     function disable(e) {
         e.preventDefault();
         self.$submit.prop('disabled', true);

scss/pages/homepage.scss

@@ -65,9 +65,6 @@
             }
         }
 
-        #what-why {
-            display: none;
-        }
         p.prose {
             text-align: justify;
             width: 55%;
@@ -287,13 +284,10 @@
         }
 
         .campaign {
-            fieldset{
-                margin: 20px;
-            }
-
             margin: 0;
             border: 20px solid $green;
             border-style: solid solid none;
+            min-width: 256px;
             h2 img {
                 width: 256px;
             }
@@ -310,6 +304,14 @@
                     }
                 }
             }
+            .video {
+                width: 100%;
+                height: 50vw;
+                max-height: 302px;
+            }
+            .pitch {
+                padding-top: 40px;
+            }
             .partners {
                 padding: 20px 0 40px;
                 .note {

tests/ttw/test_homepage.py

@@ -44,7 +44,8 @@ def test_loads_for_anon(self):
     def test_redirects_for_authed_exclamation_point(self):
         self.make_participant('alice', claimed_time='now')
         self.sign_in('alice')
-        self.reload()
+        with self.page_reload_afterwards():
+            self.visit('/')
         assert self.css('#banner h1').html == 'Browse'
         assert self.css('.you-are a').html.strip()[:6] == '~alice'
 

www/index.spt

@@ -1,6 +1,7 @@
 # -*- coding: utf-8 -*-
 import json
 import datetime
+import urllib
 from aspen import Response
 from gratipay.homepage import pay_for_open_source
 from decimal import Decimal as D
@@ -20,6 +21,16 @@ raised = website.campaign_raised
 goal = D('100000')
 today = datetime.date.today()
 ndays = (nov_1 - today).days
+video_id = "Rxm9Lex4ils"
+video_params = dict( autoplay=0
+                   , origin=website.base_url
+                   , modestbranding=1
+                   , rel=0
+                   , showinfo=0
+                   , controls=1
+                   , fs=1
+                    )
+video_src = "https://www.youtube.com/embed/{}?{}".format(video_id, urllib.urlencode(video_params))
 show_campaign = (today >= oct_1) or request.qs.get('i_am_fancy') == 'yes'
 show_campaign = request.qs.get('i_am_fancy') == 'yes'  # hack to suppress until we're ready
 
@@ -153,10 +164,13 @@ $(document).ready(function() {
             </div>
         </section>
 
-        <section class="materials">
+        <iframe class="video" type="text/html" frameborder="0"
+                src="{{ video_src|safe }}" allowfullscreen></iframe>
+
+        <section class="pitch">
 
             <p class="prose">
-                {{ _( "From {varnish} to {vuejs}, {drf} to {django} itself, {ruby} to {webpack}, there are more and more examples of community-led open source projects funded by enlightened companies."
+                {{ _( "From {varnish} to {vuejs}, {drf} to {django}, {ruby} to {webpack}, there are more and more examples of community-led open source projects funded by enlightened companies."
                     , varnish='<a href="http://phk.freebsd.dk/VML/">Varnish</a>'|safe
                     , vuejs='<a href="https://www.patreon.com/evanyou">Vue.js</a>'|safe
                     , drf='<a href="https://fund.django-rest-framework.org/topics/funding/">DRF</a>'|safe