Changeset - 6908c135f24c
[Not reviewed]
0 2 0
Brett Smith (brett) - 5 years ago 2016-12-02 15:09:12
brett@sfconservancy.org
appeal: Progress bar emphasizes current match program.
2 files changed with 22 insertions and 102 deletions:
0 comments (0 inline, 0 general)
www/conservancy/static/js/supporter-page.js
Show inline comments
...
 
@@ -21,106 +21,34 @@ $window.load(function() {
 
$(document).ready(function() {
 
    var siteFinalGoal = $('span#site-fundraiser-final-goal').text();
 
    var noCommaSiteFinalGoal = parseInt(siteFinalGoal.replace(/,/g, ""));
 
    var siteMiddleGoal = $('span#site-fundraiser-middle-goal').text();
 
    var noCommaSiteMiddleGoal = parseInt(siteMiddleGoal.replace(/,/g, ""));
 
    if (!noCommaSiteMiddleGoal) {
 
        noCommaSiteMiddleGoal = 0;
 
    }
 
    var siteSoFar = $('span#site-fundraiser-so-far').text();
 
    var noCommaSiteSoFar = parseInt(siteSoFar.replace(/,/g, ""));
 
    var siteMatchCount = $('span#site-fundraiser-match-count').text();
 
    var noCommaSiteMatchCount = parseInt(siteMatchCount.replace(/,/g, ""));
 
    if (! noCommaSiteMatchCount) {
 
        noCommaSiteMatchCount = "0";
 
    }
 
    var noCommaMatchFinalGoal = noCommaSiteFinalGoal - noCommaSiteMatchCount;
 
    var goal  = $('span#fundraiser-goal').text();
 
    var soFar = $('span#fundraiser-so-far').text();
 
    var donationCount = $('span#fundraiser-donation-count').text();
 
    var noCommaGoal = parseFloat(goal.replace(/,/g, ""));
 
    var noCommaSoFar = parseFloat(soFar.replace(/,/g, ""));
 
    var noCommaDonationCount = parseInt(donationCount.replace(/,/g, ""));
 
    var percentage = (parseFloat(noCommaSoFar) / parseFloat(noCommaGoal)) * 100;
 
    var curValue = 0.00;
 
    var incrementSoFar = 0.00;
 
    var curDonationCount = 0;
 
    var riseLevelPercent = 0.5;
 
    var incrementDonationCount = Math.round( (riseLevelPercent / 100) * noCommaDonationCount );
 
    $('#siteprogressbar').empty();
 

	
 
    if (noCommaSiteSoFar >= noCommaSiteMiddleGoal) {
 
        // We've got
 
        var leftOver = noCommaMatchFinalGoal - noCommaSiteSoFar;
 
        var supporterProgress = (noCommaSiteSoFar / noCommaSiteFinalGoal) * 100;
 
        var needProgress = (leftOver / noCommaSiteFinalGoal) * 100;
 

	
 
        $('#siteprogressbar').
 
            multiprogressbar({ parts: [
 
                { value: supporterProgress,
 
                  text: noCommaSiteSoFar.toLocaleString() + " have joined!",
 
                  barClass: "progress", textClass: "soFarText" },
 
                { value: needProgress,
 
                  text: leftOver.toLocaleString() + " more needed",
 
                  barClass: "final-goal", textClass: "goalText" },
 
                { value: 100,
 
                  text: noCommaSiteMatchCount.toLocaleString() + " matched!",
 
                  barClass: "progress", textClass: "soFarText" },
 
            ]});
 
    } else {
 
        $('#siteprogressbar').
 
            multiprogressbar({ parts: [
 
                { value: (noCommaSiteSoFar / noCommaSiteFinalGoal) * 100,
 
                  text: siteSoFar + " joined!",
 
                  barClass: "progress", textClass: "soFarText" },
 
                { value: ((noCommaSiteMiddleGoal - noCommaSiteSoFar) / noCommaSiteFinalGoal) * 100,
 
                  text: siteMiddleGoal + " will save our basic work",
 
                  barClass: "middle-goal", textClass: "goalText" },
 
                { value:
 
                  ((noCommaMatchFinalGoal - noCommaSiteMiddleGoal) / noCommaSiteFinalGoal) * 100,
 
                  text: noCommaMatchFinalGoal.toLocaleString() + " will save license compliance",
 
                  barClass: "final-goal", textClass: "goalText" },
 
                {  value: 100,
 
                   text: siteMatchCount + " matched!",
 
                   barClass: "progress", textClass: "soFarText" },
 
            ]});
 
    var barParts = [{
 
        value: (noCommaSiteMatchCount / noCommaSiteFinalGoal) * 100,
 
        text: noCommaSiteMatchCount.toLocaleString() + " matched!",
 
        barClass: "progress",
 
        textClass: "soFarText",
 
    }];
 
    if (barParts[0].value < 100) {
 
        var matchesLeft = noCommaSiteFinalGoal - noCommaSiteMatchCount;
 
        barParts.push({
 
            value: 100,
 
            text: matchesLeft.toLocaleString() + " to go!",
 
            barClass: "final-goal",
 
            textClass: "goalText",
 
        });
 
    }
 
    $('#siteprogressbar').empty().multiprogressbar(barParts);
 

	
 
    $('span#fundraiser-percentage').css({ 'color'        : 'green',
 
                                          'font-weight'  : 'bold',
 
                                          'float'        : 'right',
 
                                          'margin-right' : '40%',
 
                                          'margin-top'   : '2.5%',
 
                                          'text-align'   : 'inherit'});
 
    function riseDonationProgressBar() {
 
        if (curValue >= percentage) {
 
            $('span#fundraiser-so-far').text(soFar);
 
            $("#progressbar").progressbar({ value :  percentage });
 
            $('span#fundraiser-percentage').text(percentage.toFixed(1) + "%");
 
        } else {
 
            var newVal = (curValue / 100.00) * noCommaGoal;
 
            $("#progressbar").progressbar({ value:  curValue });
 
            $('span#fundraiser-so-far').text(newVal.toLocaleString());
 
            curValue += riseLevelPercent;
 
            setTimeout(riseDonationProgressBar, 50);
 
        }
 
    }
 
    function riseDonationCount() {
 
        if (curDonationCount >= noCommaDonationCount) {
 
            $('span#fundraiser-donation-count').text(donationCount);
 
        } else {
 
            $('span#fundraiser-donation-count').text(curDonationCount.toLocaleString());
 
            curDonationCount += incrementDonationCount;
 
            setTimeout(riseDonationCount, 50);
 
        }
 
    }
 
    if (noCommaDonationCount > 0) {
 
        $('span#fundraiser-donation-count').text("");
 
        riseDonationCount();
 
    }
 
    if (noCommaSoFar > 0.00 && noCommaGoal > 0.00) {
 
        $('span#fundraiser-percentage').text("");
 
        $("#progressbar").progressbar({ value:  curValue });
 
        riseDonationProgressBar();
 
    }
 

	
 
    $('.toggle-content').hide();
 

	
www/conservancy/templates/base_conservancy.html
Show inline comments
...
 
@@ -60,12 +60,7 @@ PIA will match up to 416.
 
    <div class="fundraiser-top-text">
 
      <em>
 
        Let's stand up for software freedom together!
 
        {% if sitefundgoal.fundraiser_goal_amount > sitefundgoal.fundraiser_so_far_amount %}
 
        We still need
 
        {{ sitefundgoal.fundraiser_goal_amount|subtract:sitefundgoal.fundraiser_donation_count_disclose_threshold|subtract:sitefundgoal.fundraiser_so_far_amount|intcomma }}
 
        more Supporters to maintain our full range of activities in 2017.
 
        {% endif %}
 
        {% if sitefundgoal.fundraiser_donation_count_disclose_threshold > 1076 %}
 
        {% if sitefundgoal.fundraiser_donation_count_disclose_threshold >= 1076 %}
 
        416 Supporters were matched
 
        {% else %}
 
        The next {{ 1076|subtract:sitefundgoal.fundraiser_donation_count_disclose_threshold|intcomma }} Supporters who join or renew by January 15 <a href="/news/2016/nov/29/private-internet-access-2016-fundraising-match/">will count twice</a>,
...
 
@@ -74,16 +69,13 @@ PIA will match up to 416.
 
      </em>
 
<div id="siteprogressbar">
 
<a href="/supporter">
 
  <span id="site-fundraiser-so-far">{{ sitefundgoal.fundraiser_so_far_amount|intcomma }}</span> have joined so far.
 
  <span id="site-fundraiser-match-count">{{ sitefundgoal.fundraiser_donation_count_disclose_threshold|intcomma }}</span> Supporters have been matched.
 
  {% if sitefundgoal.fundraiser_goal_amount > sitefundgoal.fundraiser_so_far_amount %}
 
  We still need
 
  {{ sitefundgoal.fundraiser_goal_amount|subtract:sitefundgoal.fundraiser_donation_count_disclose_threshold|subtract:sitefundgoal.fundraiser_so_far_amount|intcomma }}
 
  more Supporters to reach
 
  {% if sitefundgoal.fundraiser_donation_count_disclose_threshold < 1076 %}
 
  <span id="site-fundraiser-match-count">{{ sitefundgoal.fundraiser_donation_count_disclose_threshold|subtract:660|intcomma }}</span>
 
  {% else %}
 
  That means we reached
 
  <span id="site-fundraiser-match-count">416</span>
 
  {% endif %}
 
  our goal of <span id="site-fundraiser-final-goal">{{ sitefundgoal.fundraiser_goal_amount|intcomma }}</span>.
 
  Supporters have been matched, out of
 
  <span id="site-fundraiser-final-goal">416</span> possible.
 
</a>
 
</div>
 
</div>
0 comments (0 inline, 0 general)