From 44301d386ba0e951d66a4c9f2a798ded5bae22b1 Mon Sep 17 00:00:00 2001
From: "Bradley M. Kuhn" <bkuhn@ebb.org>
Date: Tue, 2 Dec 2014 18:25:42 -0500
Subject: [PATCH] Correct Markdown-style footnote w/ HTML style one.

This footnote is now correctly formatted in HTML, with links back and
forth, as well as a jQuery UI tooltip popup for the footnote.
---
 www/conservancy/static/conservancy.css      |  4 ++++
 www/conservancy/static/supporter-page.js    | 22 +++++++++++++++++++--
 www/conservancy/static/supporter/index.html |  5 +++--
 3 files changed, 27 insertions(+), 4 deletions(-)

diff --git a/www/conservancy/static/conservancy.css b/www/conservancy/static/conservancy.css
index 9ec0249e..82a9251a 100644
--- a/www/conservancy/static/conservancy.css
+++ b/www/conservancy/static/conservancy.css
@@ -37,6 +37,10 @@ text-decoration: none; color: #557733;
     .donate-sidebar { display: none; }
 }
 
+p.footnote {
+    font-size: 85%;
+}
+
 h1 { margin-top: .75em; margin-bottom: .5em; }
 h2 { margin-top: .75em; margin-bottom: .5em; }
 h3 { margin-top: .6em; margin-bottom: .4em; }
diff --git a/www/conservancy/static/supporter-page.js b/www/conservancy/static/supporter-page.js
index 68952c49..3bbe284a 100644
--- a/www/conservancy/static/supporter-page.js
+++ b/www/conservancy/static/supporter-page.js
@@ -78,8 +78,26 @@ $(document).ready(function() {
         $('#annualSelector').css("font-weight", "bold").css("font-size", "127%");
         $('#monthlySelector').css("font-weight", "normal").css("font-size", "125%");
     });
-
-  });
+    $( ".footnote-mark" ).tooltip({
+        items: "a",
+        hide: { duration: 5000 },
+        position: {
+            my: "center bottom-20",
+            at: "center left",
+            using: function( position, feedback ) {
+                $( this ).css( position );
+                $( "<div>" )
+                    .addClass( "arrow" )
+                    .addClass( feedback.vertical )
+                    .addClass( feedback.horizontal )
+                    .appendTo( this );
+            }
+        },
+        content: function() {
+            return $('.footnote-1-text').text();
+        }
+    });
+});
 
 $(window).load(function () {
     verifySelctionCorrectOnPageLoad = function() {
diff --git a/www/conservancy/static/supporter/index.html b/www/conservancy/static/supporter/index.html
index 407e9084..73cf47f5 100644
--- a/www/conservancy/static/supporter/index.html
+++ b/www/conservancy/static/supporter/index.html
@@ -77,7 +77,7 @@ contribute to the cause.</p>
 
 <p>For the first time, we're launching a Supporter
 program. For <a href="#donate-box" class="donate-now">an annual donation of $120</a>, you can
-download an official Supporter card and receive a Conservancy t-shirt[1]. If
+download an official Supporter card and receive a Conservancy t-shirt<a id="return-footnote-shirts-when"></a><sup class="footnote-mark"><a href="#footnote-shirts-when">1</a></sup>. If
 this is out of reach, please donate at whatever level you can - it makes a
 big difference to us to know that you <a href="#donate-box" class="donate-now">support us</a>, and a little goes a long
 way.</p>
@@ -122,7 +122,8 @@ internal policies</a> are published and available for scrutiny.</p>
 
 <p>Please <a href="#donate-box" class="donate-now">join our Supporter program</a> and spread software freedom!</p>
 
-[1] the shirts will ship First Quarter 2015.
+<p class="footnote"><sup><a href="#return-footnote-shirts-when">1</sup></a><a id="footnote-shirts-when"></a><span class="footnote-1-text">The
+    shirts will ship during Q1 2015.</div></p>
 
 <hr/>
 <div class="supporter-type-selector">