var $ = require("jquery")
var Backbone = require("backbone")
var _ = require("underscore")
var moment = require("moment")
var Pikaday = require("pikaday")
var DatePickerView = Backbone.View.extend({

  initialize() {
    this.data = JSON.parse(this.$('.js-dataLangDate').html())
    this.currentLang = $('html').prop('lang')
    this.format = this.data.lang[this.currentLang].format
    this.formatEN = "MM/DD/YYYY"

    this.datePickers = _.map(
      this.$(".js-DatePicker"),
      (node) => new Pikaday({
        field : node,
        firstDay : 1,
        minDate : new Date(),
        format: this.format,
        i18n: this.data.lang[this.currentLang].i18n,
        container: node.closest("#adg-DatePickerContainer"), // L'ID de mon Container

        onDraw: function(){
          this.el.children[0].innerHTML =
            `<div class="pika-title-text" >` +
              $(node).data('title') +
            `</div>` +
            this.el.children[0].innerHTML
        }
      })
    )

    //this.initialRender()
  },

  events : {
      "change .js-DatePicker" : "changeDate"
  },

  changeDate(e){
    var target = e.target;
    if($(target).hasClass('js-DatePicker-dateStart')){
      var startDate = moment(this.$(".js-DatePicker-dateStart").val(), this.format);
      for(var i= 0; i < this.datePickers.length; i++){
        if ($(this.datePickers[i]._o.field).hasClass("js-DatePicker-dateEnd")){
          var dateStart = moment(startDate);
          var dateEnd = this.datePickers[i].getMoment();
          this.datePickers[i].setMinDate(dateStart.add(1, "days").toDate());
          var diffDate = dateEnd.diff(dateStart, 'days');
          if(diffDate < 1){
              this.datePickers[i].setMoment(dateStart);
          }
        }
      }
    }

    /*if($(target).hasClass('js-DatePicker-dateEnd')){
      var endDate = moment(this.$(".js-DatePicker-dateEnd").val(), this.format);
      for(var i= 0; i < this.datePickers.length; i++){
        if ( _.indexOf(this.datePickers[i]._o.field.classList, "js-DatePicker-dateStart") !== -1){
          this.datePickers[i].setMaxDate(moment(endDate).subtract("days",1));
        }
      }
    }*/

  },

  initialRender() {
    this.$('.js-DatePicker').val('')
  }


})

module.exports = DatePickerView