Merge pull request #201 from rmostafa/crowdhoster_issue_27

issue #27 Better Countdown Handling

Gemfile

@@ -16,7 +16,7 @@ gem 'paperclip', '~> 3.0'
 gem 'ckeditor'
 gem 'aws-sdk'
 gem 'active_model_serializers'
-
+gem 'momentjs-rails'
 # Front-end
 gem 'bootstrap-sass', '2.1'
 gem 'jquery-rails'

Gemfile.lock

@@ -138,6 +138,8 @@ GEM
       treetop (~> 1.4.8)
     method_source (0.8.1)
     mime-types (1.23)
+    momentjs-rails (2.5.0)
+      railties (>= 3.1)
     multi_json (1.7.6)
     multipart-post (1.2.0)
     net-scp (1.1.1)
@@ -260,6 +262,7 @@ DEPENDENCIES
   jquery-rails
   jquery-ui-rails
   lograge
+  momentjs-rails
   newrelic_rpm
   nokogiri
   paperclip (~> 3.0)

app/assets/javascripts/application.js

@@ -29,3 +29,4 @@
 //= require validate
 //= require event_tracking
 //= require unsaved_changes.js
+//= require moment

app/assets/javascripts/campaigns.js.coffee

@@ -44,7 +44,7 @@ Crowdhoster.campaigns =
       $('input').prop('checked', false)
       $('#amount').removeClass('error')
       $('.error').hide()
-
+    
     $('#amount_form').on "submit", (e) ->
       e.preventDefault()
       $reward = $('.reward_option.selected')
@@ -57,6 +57,7 @@ Crowdhoster.campaigns =
         $('.error').html('Amount must be at least $' + $reward.attr('data-price') + ' to select that ' + $('#reward_select').attr('data-reference') + '.').show()
       else
         this.submit()
+    this.timeCheck('#days')
 
   submitPaymentForm: (form) ->
     $('#refresh-msg').show()
@@ -90,7 +91,31 @@ Crowdhoster.campaigns =
       user_id = $form.find('#ct_user_id').val()
       crowdtilt.card.create(user_id, cardData, this.cardResponseHandler)
 
-
+  timeCheck: (element) ->
+    expiration = $(element).attr("date-element")          
+    date_moment = moment.unix(expiration)
+    expired = moment().diff(date_moment, "seconds") > 0
+    if expired
+      $(element).html  "No <span>days left!</span>"
+      return
+    months = date_moment.diff(moment(), "months")
+    days = date_moment.diff(moment(), "days")
+    refDate = "months"
+    refDiff = months
+    if days < 120
+      hours = date_moment.diff(moment(), "hours")
+      if hours > 72
+        refDiff = days
+        refDate = "days"
+      else
+        if hours >= 2
+          refDiff = hours
+          refDate = "hours"
+        else
+          refDiff = date_moment.diff(moment(), "minutes")
+          refDate = "minutes"
+    $(element).html refDiff + "<span style=\"width:100px\">" + refDate + " left</span>"
+
   cardResponseHandler: (response) ->
     form = document.getElementById('payment_form')
     request_id_token = response.request_id

app/views/theme/views/campaign.html.erb

@@ -58,17 +58,8 @@
             </li>
           <% end %>
 
-          <% if !@campaign.expired? %>
-            <li class="stats" id="days">
-              <%= distance_of_time_in_words_to_now(@campaign.expiration_date).gsub(/\D/, "") %>
-              <span style="width:100px"><%= distance_of_time_in_words_to_now(@campaign.expiration_date).gsub(/\d/, "").gsub("about", "") %> left</span>
-            </li>
-          <% else %>
-            <li class="stats" id="days">
-              No
-              <span>days left!</span>
-            </li>
-          <% end %>
+          <li class="stats" id="days" date-element="<%= @campaign.expiration_date.to_i %>" >           
+          </li>
         </ul>
 
         <% if @campaign.raised_amount < @campaign.goal_dollars %>