(function ($) {
  var kendo = window.kendo,
    ui = kendo.ui,
    Widget = ui.Widget,
    proxy = $.proxy,
    CHANGE = 'change',
    PROGRESS = 'progress',
    ERROR = 'error',
    NS = '.generalInfo';

  var MaskedDateTimePicker = Widget.extend({
    init: function (element, options) {
      var that = this;
      Widget.fn.init.call(this, element, options);

      var mask = '0000. 00. 00. 00:00';
      var format = 'yyyy. MM. dd. HH:mm';
      var parseFormats = 'yyyy. MM. dd. HH:mm';
      var minDate = '1900. 01. 01. 00:00';
      var maxDate = '2100. 01. 01. 00:00';

      if (typeof options !== 'undefined') {
        $.each(options, function (index, value) {
          if (index == 'dateOptions.mask') {
            mask = value;
          }
          if (index == 'dateOptions.format') {
            format = value;
          }
          if (index == 'dateOptions.parseFormats') {
            parseFormats = value;
          }
        });
      }

      var dateTimePickerOptions = {};

      //ha már van rajta datePicker (MVC-s helper miatt), akkor azt levesszük, de a beállításait megtartjuk
      var dateTimePicker = $(element).data('kendoDateTimePicker');
      if (typeof dateTimePicker !== 'undefined') {
        dateTimePickerOptions = dateTimePicker.options;
        dateTimePicker.destroy();
      }

      dateTimePickerOptions.format = format;
      dateTimePickerOptions.parseFormats = parseFormats;
      dateTimePickerOptions.minDate = minDate;
      dateTimePickerOptions.maxDate = maxDate;

      $(element)
        .kendoMaskedTextBox({ mask: mask, culture: 'en-US' })
        .kendoDateTimePicker(dateTimePickerOptions)
        .closest('.k-datetimepicker')
        .add(element)
        .removeClass('k-textbox');

      that.element.data('kendoDateTimePicker').bind('change', function () {
        that.trigger(CHANGE);
      });
    },
    options: {
      name: 'MaskedDateTimePicker',
      dateOptions: {}
    },
    events: [CHANGE],
    destroy: function () {
      var that = this;
      Widget.fn.destroy.call(that);

      kendo.destroy(that.element);
    },
    value: function (value) {
      var datetimepicker = this.element.data('kendoDateTimePicker');

      if (CommonUtils.isNullOrUndefined(value)) {
        return datetimepicker.value();
      }

      datetimepicker.value(value);
    }
  });

  ui.plugin(MaskedDateTimePicker);
})(window.kendo.jQuery);