/**
 * Created by mdonnel on 10/04/2017.
 */
const $ = require('jquery');
const _ = require('underscore');
const Backbone = require('backbone');

const EventModel = Backbone.Model.extend({
  'initialize': function () {
    this.update();
  },
  'getDays' : function(startdate, enddate) {
    const s = startdate.getTime();
    const e = enddate.getTime();
    return (e - s) / (24 * 60 * 60 * 1000);
  },
  'update': function () {
    const now = new Date;
    const mod = 3600000 - (now.getTime() % 3600000);
    const data = {};
    data.days = Math.ceil(this.getDays(now, this.get('event')));
    data.weeks = Math.ceil(this.getDays(now, this.get('event')) / 7);
    this.set('data', data);

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

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

const EventView = Backbone.View.extend({
  'tagName': 'div',
  'initialize': function () {
    _.bindAll(this, 'render');
    this.model.bind('change', this.render);
    this.id = `e_${ Math.random().toString(36).substr(2, 9)}`;
    this.$events = $('#events');
    this.$myEvent = null;
    this.$el = this.$events;
    this.initView();
    this.render();
  },
  'render': function () {
    const label = this.model.get('label');
    const data = this.model.get('data');
    const str = `${label} ${data.days} days / ${data.weeks} weeks`;
    this.$myEvent.empty().append(str);
  },
  'initView': function () {
    const html = `<div class='mui-col-xs-12 mui-col-md-3' id="${this.id}"></div>`;
    this.$html = $(html);
    this.$events.append(this.$html);
    this.$myEvent = $(`#${this.id}`);
  }
});

module.exports = { EventModel, EventView };