/**
 *
 * User: Martin Donnelly
 * Date: 2016-10-03
 * Time: 14:20
 *
 */
var ClockModel = Backbone.Model.extend({
  initialize: function() {
    this.set('now',new Date);
    this.update();
  },
  update: function() {
    var now = new Date;
    var mod = 60000 - (now.getTime() % 60000);
    this.set('now',now);

    var clockFn = function() {
      this.update();
    };

    setTimeout(clockFn.bind(this), mod + 10);
  }
});

var Clock = Backbone.View.extend({
  tagName: 'div',
  initialize: function() {
    _.bindAll(this, 'render');
    this.model.bind('change', this.render);
    this.$date = $('#date');
    this.$time = $('#time');
    this.render();
  },
  render: function() {
    var now = this.model.get('now');
    //var curTime = now.format('<span class="hour">{24hr}</span>{mm}');
    var curTime = now.format('<span class="time">{24hr} {mm}</span>');

    var curDate = now.format('{yyyy}-{MM}-{dd}');
    if (this.prevTime !== curTime) {
      this.$time.html(curTime);
      this.prevTime = curTime;
    }

    if (this.prevDate !== curDate) {
      this.$date.html(now.format(
        '<span class="wd-{do}">{Weekday}</span> <span class="mo mo-{M}">{Month} {dd}</span> {yyyy}'));
      this.prevDate = curDate;
    }
  }
});