Only run function if date is less than the other

Question

I have built a counter that counts (both up and down) the date. I only want to have the counter function run down, and once it hits the current date or later to stop running altogether. Right now it alerts saying the date is reached but continues counting even though it has reached the date.

Here is the JSFiddle for the counter.

Here is the Boolean

  if(tDate == eDate) {
    alert('Today is the event!');
    return false;
    // clearTimeout( countDown.prototype.update() );
  } else {
    counter();
  }

Here is the whole code

$(document).ready(function() {
  var monthNames = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
  var d = new Date();
  var month = monthNames[d.getMonth()];
  var day = d.getUTCDate();
  var year = d.getUTCFullYear();

  var eMonth = $("#d-month").html();
  var eDay = $("#d-day").html();
  var eYear = $("#d-year").html();

  var tDate = month + " " + day + " " + year;
  var eDate = eMonth + " " + eDay + " " + eYear;

  alert("today's date: " + tDate + " event's date: " + eDate);

  if(tDate == eDate) {
    alert('Today is the event!');
    return false;
    // clearTimeout( countDown.prototype.update() );
  } else {
    counter();
  }

  function counter() {
    function countDown(initDate, id) {
      this.counterDate = new Date(initDate);
      this.update();
    }
    countDown.prototype.calculateUnit=function(secDiff, unitSeconds){
      var tmp = Math.abs((tmp = secDiff/unitSeconds)) < 1? 0 : tmp;
      return Math.abs(tmp < 0 ? Math.ceil(tmp) : Math.floor(tmp));
    }
    countDown.prototype.calculate=function(){
      var secDiff = Math.abs(Math.round(((new Date()) - this.counterDate)/1000));
      this.days = this.calculateUnit(secDiff,86400);
      this.hours = this.calculateUnit((secDiff-(this.days*86400)),3600);
      this.mins = this.calculateUnit((secDiff-(this.days*86400)-(this.hours*3600)),60);
      this.secs = this.calculateUnit((secDiff-(this.days*86400)-(this.hours*3600)-(this.mins*60)),1);
    }
    countDown.prototype.update=function(){ 
      this.calculate();
      $("#countdown-day").html(this.days + (this.days == 1));
      $("#countdown-hour").html(this.hours + (this.hours == 1));
      $("#countdown-min").html(this.mins + (this.mins == 1));
      $("#countdown-sec").html(this.secs + (this.secs == 1));
      var self = this;
      setTimeout(function(){self.update();}, (1000));
    }
    function counterInit() { 
      var month = $("#d-month").html();
      var day = $("#d-day").html();
      var year = $("#d-year").html();
      var time = $("#d-time").html();
      new countDown( month + day + "," + year + time);
      // new countDown('May 9, 2015, 00:00:00', 'counter'); }
    }
    counterInit();
  }
});

Answer 1

I tried your fiddle and I can tell you there are some blank spaces at the end of each string which makes them differ between each other.

So If you just add these lines it will work

tDate = jQuery.trim(tDate);
eDate = jQuery.trim(eDate);

Here's your fiddle updated http://jsfiddle.net/c5qkm5gL/

Edit:

I forgot to mention that I changed '.html()' to '.text()', this way you get the plain text instead of the html content.

As an advice, for debugging use console.log instead of an alert.