Ext.namespace('Zarafa.calendar.settings');

/**
 * @class Zarafa.calendar.settings.SettingsCalendarWidget
 * @extends Zarafa.settings.ui.SettingsWidget
 * @xtype zarafa.settingscalendarwidget
 *
 * The {@link Zarafa.settings.ui.SettingsWidget widget} for configuring
 * the general calendar options in the {@link Zarafa.calendar.settings.SettingsCalendarCategory calendar category}.
 */
Zarafa.calendar.settings.SettingsCalendarWidget = Ext.extend(Zarafa.settings.ui.SettingsWidget, {

	/**
	 * @constructor
	 * @param {Object} config Configuration object
	 */
	constructor : function(config)
	{
		config = config || {};

		var dayData = [];
		for (var i = 0, len = Date.dayNames.length; i < len; i++) {
			dayData.push({
				name : Date.dayNames[i],
				value : i
			});
		}

		var dayStore = {
			xtype : 'jsonstore',
			fields : [ 'name', 'value' ],
			data : dayData
		};

		var zoomStore = {
			xtype : 'jsonstore',
			fields : [ 'name', 'value' ],
			data : [{
				value : 5,
				name : Ext.util.Format.duration(5)
			},{
				value : 6,
				name : Ext.util.Format.duration(6)
			},{
				value : 10,
				name : Ext.util.Format.duration(10)
			},{
				value : 15,
				name : Ext.util.Format.duration(15)
			},{
				value : 30,
				name : Ext.util.Format.duration(30)
			},{
				value : 60,
				name : Ext.util.Format.duration(60)
			}]
		};

		Ext.applyIf(config, {
			title : _('General calendar settings'),
			layout : 'form',
			items : [{
				xtype : 'combo',
				ref : 'weekStartCombo',
				fieldLabel : _('First day of the week'),
				name : 'zarafa/v1/main/week_start',
				store : dayStore,
				mode: 'local',
				triggerAction: 'all',
				displayField: 'name',
				valueField: 'value',
				lazyInit: false,
				autoSelect : true,
				forceSelection: true,
				editable: false,
				listeners : {
					select : this.onFieldSelect,
					scope : this
				}
			},{
				xtype : 'zarafa.timeperiodfield',
				ref : 'workingHourPeriod',
				defaultValue : new Zarafa.core.DateRange(),
				defaultPeriod : 1,
				defaultPeriodType : Date.HOUR,
				labelWidth : 200,
				startFieldConfig : {
					fieldLabel : _('Start of workday'),
					name : 'zarafa/v1/main/start_working_hour',
					incrementValue : 30,
					alternateIncrementValue : 1,
					minValue : new Date().clearTime(),
					maxValue : new Date().clearTime().add(Date.HOUR, 23)
				},
				endFieldConfig : {
					fieldLabel : _('End of workday'),
					name : 'zarafa/v1/main/end_working_hour',
					incrementValue : 30,
					alternateIncrementValue : 1,
					minValue : new Date().clearTime().add(Date.HOUR, 1),
					maxValue : new Date().clearTime().add(Date.HOUR, 24)
				},
				listeners : {
					change  :this.onWorkTimeChange,
					scope : this
				}
			},{
				xtype : 'combo',
				ref : 'zoomLevelCombo',
				fieldLabel : _('Calendar resolution'),
				name : 'zarafa/v1/contexts/calendar/default_zoom_level',
				store : zoomStore,
				mode: 'local',
				triggerAction: 'all',
				displayField: 'name',
				valueField: 'value',
				lazyInit: false,
				autoSelect : true,
				forceSelection: true,
				editable: false,
				listeners : {
					select : this.onFieldSelect,
					scope : this
				}
			},{
				xtype : 'checkboxgroup',
				ref : 'workingDays',
				fieldLabel : _('Working days'),
				name : 'zarafa/v1/main/working_days',
				width : 225,
				columns: 4,
				items: [
				{
					boxLabel: _('Mon'),
					name: 'day-col-1',
					inputValue: 1
				},{
					boxLabel: _('Tue'),
					name: 'day-col-2',
					inputValue: 2
				},{
					boxLabel: _('Wed'),
					name: 'day-col-3',
					inputValue: 3
				},{
					boxLabel: _('Thu'),
					name: 'day-col-4',
					inputValue: 4
				},{
					boxLabel: _('Fri'),
					name: 'day-col-5',
					inputValue: 5
				},{
					boxLabel: _('Sat'),
					name: 'day-col-6',
					inputValue: 6
				},{
					boxLabel: _('Sun'),
					name: 'day-col-0',
					inputValue: 0
				}]
			},{
				xtype : 'checkbox',
				ref : 'boldCheck',
				boxLabel : _('Show busy dates as bold in the date picker'),
				hideLabel : true,
				name : 'zarafa/v1/contexts/calendar/datepicker_show_busy',
				listeners : {
					check : this.onBoldCheck,
					scope : this
				}
			}]
		});

		Zarafa.calendar.settings.SettingsCalendarWidget.superclass.constructor.call(this, config);
	},

	/**
	 * Called by the {@link Zarafa.settings.ui.SettingsCategory Category} when
	 * it has been called with {@link zarafa.settings.ui.SettingsCategory#update}.
	 * This is used to load the latest version of the settings from the
	 * {@link Zarafa.settings.SettingsModel} into the UI of this category.
	 * @param {Zarafa.settings.SettingsModel} settingsModel The settings to load
	 */
	update : function(settingsModel)
	{
		this.model = settingsModel;

		// Convert the start of workday from minutes to an actual time
		var startTime = new Date().clearTime();
		startTime = startTime.add(Date.MINUTE, settingsModel.get(this.workingHourPeriod.startField.name));
		// Convert the end of  workday from minutes to an actual time
		var endTime = new Date().clearTime();
		endTime = endTime.add(Date.MINUTE, settingsModel.get(this.workingHourPeriod.endField.name));
		this.workingHourPeriod.getValue().set(startTime, endTime);

		this.weekStartCombo.setValue(settingsModel.get(this.weekStartCombo.name));
		this.zoomLevelCombo.setValue(settingsModel.get(this.zoomLevelCombo.name));
		this.boldCheck.setValue(settingsModel.get(this.boldCheck.name));

		// checkboxgroup.setValue() takes an object with name property as key and boolean values to set the checkboxes.
		// The workingDaysList contains a list of days which are enabled by the user.
		// Sunday 0, Monday 1, Tuesday 2, Wednesday 3, Thursday 4, Friday 5, Saturday 6
		var workingDaysList = this.model.get(this.workingDays.name);
		var dayList = {};
		for (var i = 0; i <= 6; i++) {
			if(workingDaysList.indexOf(i) > -1 ) {
				dayList['day-col-' + i] = true;
			} else {
				dayList['day-col-' + i] = false;
			}
		}
		this.workingDays.setValue(dayList);

		// Hack! @FIXME
		// Change event needs to be registered after the values are configured into the corresponding check box.
		// Because change event will be fired for every checkbox providing cumulative values, so we failed to figure out
		// if there is any actual change performed by user.
		this.mon(this.workingDays, 'change', this.onWorkingDaysChange, this, { single: true });
	},

	/**
	 * Called by the {@link Zarafa.settings.ui.SettingsCategory Category} when
	 * it has been called with {@link zarafa.settings.ui.SettingsCategory#updateSettings}.
	 * This is used to update the settings from the UI into the {@link Zarafa.settings.SettingsModel settings model}.
	 * @param {Zarafa.settings.SettingsModel} settingsModel The settings to update
	 */
	updateSettings : function(settingsModel)
	{
		settingsModel.beginEdit();
		this.onWorkTimeChange(this.workingHourPeriod, this.workingHourPeriod.getValue());
		settingsModel.set(this.weekStartCombo.name, this.weekStartCombo.getValue());
		settingsModel.set(this.zoomLevelCombo.name, this.zoomLevelCombo.getValue());
		settingsModel.set(this.boldCheck.name, this.boldCheck.getValue());
		settingsModel.set(this.workingDays.name, Ext.pluck(this.workingDays.getValue(), 'inputValue'));
		settingsModel.endEdit();
	},

	/**
	 * Event handler which is called when a selection has been made in the
	 * {@link Ext.form.ComboBox combobox}.
	 * @param {Ext.form.ComboBox} field The field which fired the event
	 * @param {Ext.data.Record} record The selected record
	 * @private
	 */
	onFieldSelect : function(field, record)
	{
		if (this.model) {
			var set = record.get(field.valueField);

			// FIXME: The settings model should be able to detect if
			// a change was applied
			if (this.model.get(field.name) !== set) {
				this.model.set(field.name, set);
			}
		}
	},

	/**
	 * Event handler which is fired when the {@link Zarafa.common.ui.TimePeriodField}
	 * fires the {@link Zarafa.common.ui.TimePeriodField#change change} event.
	 * @param {Zarafa.common.ui.TimePeriodField} field The field which fired the event
	 * @param {Zarafa.core.DateRange} newValue The new value which is set on the field
	 * @param {Zarafa.core.DateRange} oldValue the old value which was previously set
	 * @private
	 */
	onWorkTimeChange  : function(field, newValue, oldValue)
	{
		if (this.model) {
			// Convert the start of workday from date to number
			var startTime = newValue.getStartDate();
			startTime = (startTime.getHours() * 60) + startTime.getMinutes();
			var endTime = newValue.getDueDate();
			endTime = (endTime.getHours() * 60) + endTime.getMinutes();

			// Compensation in case the user managed to get a end time before the start time.
			if (endTime < startTime) {
				endTime = startTime + (this.workingHourPeriod.defaultPeriod * 60);
			}

			this.model.set(this.workingHourPeriod.startField.name, startTime);
			this.model.set(this.workingHourPeriod.endField.name, endTime);
		}
	},

	/**
	 * event handler which is fired when the "Bold days in datepicker" checkbox has been clicked.
	 * @param {Ext.form.ComboBox} field The field which fired the event
	 * @param {Ext.data.Record} record The selected record
	 * @private
	 */
	onBoldCheck : function(field, check)
	{
		if (this.model) {
			// FIXME: The settings model should be able to detect if
			// a change was applied
			if (this.model.get(field.name) !== check) {
				this.model.set(field.name, check);
			}
		}
	},

	/**
	 * Event handler which is fired when a checkbox in the "working days" checkboxgroup has been clicked
	 * @param {Ext.form.CheckboxGroup} field the field is {@link Ext.form.CheckboxGroup checkbox}
	 * @param {Array} checkedArray the checkedArray containing the checked boxes
	 * @private
	 */
	onWorkingDaysChange : function(field, checkedArray)
	{
		if (this.model) {
			this.model.set(this.workingDays.name, Ext.pluck(this.workingDays.getValue(), 'inputValue'));
		}
	}
});

Ext.reg('zarafa.settingscalendarwidget', Zarafa.calendar.settings.SettingsCalendarWidget);