tweaking celebration counter in the home

app/assets/javascripts/flipclock/counter.js

@@ -14,6 +14,11 @@ App.addChild('Counter', {
     this.initial = parseFloat(this.$el.data('initial'));
     this.rate = parseFloat(this.$el.data('rate'));
     this.current = this.initial;
+    if(this.current >= this.max){
+      $('.counter_panel.dynamic').hide();
+      $('.counter_panel.static').fadeIn(5000);
+      return;
+    }
 
     var that = this;
     var currentDigits = lpad(this.current.toString(), "0", this.max.toString().length);
@@ -37,7 +42,26 @@ App.addChild('Counter', {
     this.timer = window.setInterval(function(){ that.incrementCounter() }, 1000);
   },
 
+  changeBanner: function(){
+    $('.counter_panel.dynamic').fadeOut('slow', function(){
+      $('.counter_panel.static').fadeIn('slow');
+    });
+  },
+
   fetchCounter: function(){
+    var that = this;
+    $.get("/pt/projects/total_backed").success(function(data){
+      var value = parseInt(data);
+      if(value >= that.max){
+        window.clearTimeout(that.timer);
+        var delta = that.max - that.current;
+        that.incrementDigit((that.digits.length - 1), delta);
+        that.digits.each(function(){
+          that.select($(this));
+        });
+        window.setTimeout(that.changeBanner, 3500);
+      }
+    });
   },
 
   incrementCounter: function(){
@@ -62,7 +86,7 @@ App.addChild('Counter', {
     if(digitIndex < 0){
       console.log('out of digits');
     }
-    if(delta == 0){
+    if(delta <= 0){
       return;
     }
     var digit = $(this.digits[digitIndex]);

app/assets/stylesheets/flipclock/_counter.sass

@@ -6,6 +6,10 @@
   overflow: hidden
   +border-radius(4px)
 
+  &.static
+    background: image-url('flipclock/bg_rewards.jpg') left top no-repeat
+    display: none
+
   .counter_title
     text-transform: uppercase
     font-size: 15px

app/controllers/projects_controller.rb

@@ -19,6 +19,10 @@ class ProjectsController < ApplicationController
     )
   end
 
+  def total_backed
+    render json: backer_stats["sum"]
+  end
+
   def index
     index! do |format|
       format.html do

app/views/projects/_counter.html.slim

@@ -1,4 +1,5 @@
-.counter_panel
+.counter_panel.static
+.counter_panel.dynamic
   .counter_title
     | Apoie  um  projeto  e  vamos  juntos  aos  R$ 10  milhões  arrecadados!
   .counter[data-max="10000000" data-initial="#{backer_stats['sum'].to_i}" data-rate="#{backer_stats['rate'] || 1.07851851851851851852}"]

config/routes.rb

@@ -90,6 +90,7 @@ Catarse::Application.routes.draw do
     end
     collection do
       get 'video'
+      get 'total_backed'
     end
     member do
       put 'pay'