
/**
 * @class Ext.ux.xpd.I18nField
 * Base class that all group components of the XPD component uses
 * @extends Ext.tab.Panel
 */

Ext.define("Ext.ux.xpd.I18nField", {

	extend: "Ext.form.FieldContainer",

	alias: [
		"widget.i18nxpdeditorfield"
	],

	mixins: {
		field: "Ext.form.field.Field"
	},

	cls: "x-ux-form-xpdlanguagepanel",

	tabPosition: "bottom",

	xpd: "",

	dataParent: null,

	defaultLanguage: "en",

	languages: null,

	value: "",

	layout: "fit",

	languageControllers: null,
	tabPanel: null,

	initComponent: function() {

		var i_cmp = this;
		var o_config = i_cmp.initialConfig;

		var o_xpd = ip2.resource.get(i_cmp.xpd, true);

		Ext.apply(i_cmp, {
			languageControllers: {},
			value: o_config.value || i_cmp.value,
			languages: o_config.languages,
			defaultLanguage: o_config.defaultLanguage || i_cmp.defaultLanguage,
			xpdCollection: o_xpd,
			items: [
				{
					xtype: "tabpanel",
					itemId: "tabPanel",
					tabPosition: i_cmp.tabPosition,
					autoScroll: true,
					layout: "fit"
				}
			]
		});

		// Sort languages so defaultLanguage is first
		var a_languages = [];
		a_languages.push(i_cmp.defaultLanguage);
		Ext.Array.each(i_cmp.languages, function (s_lang) {
			if (s_lang != i_cmp.defaultLanguage) {
				a_languages.push(s_lang);
			}
		});
		i_cmp.languages = a_languages;

		i_cmp.callParent(arguments);

		i_cmp.initLanguageControllers();

		i_cmp.initField();

		return i_cmp;
	},

	initLanguageControllers: function () {

		var i_cmp = this;
		var a_languages = i_cmp.languages;
		var i_tabPanel = i_cmp.down("#tabPanel");

		Ext.Array.each(a_languages, function (s_language) {

			var o_controller = i_cmp.createLanguageController(s_language);
			var i_controller = i_tabPanel.add(o_controller);

			i_controller.syncTabIcon();

			i_cmp.languageControllers[s_language] = i_controller;
		});
	},

	createLanguageController: function (s_lang) {

		var i_cmp = this;
		var i_controller;
		var s_lockId = "xpdlock";
		var s_fieldId = "xpdfield";

		var a_languages = i_cmp.languages;

		var s_primaryLanguage = i_cmp.defaultLanguage;
		var s_currentLanguage = s_lang;

		var s_primaryLanguageTitle = wsh.i18n.getEnum(s_primaryLanguage);
		var s_currentLanguageTitle = wsh.i18n.getEnum(s_currentLanguage);

		i_controller = Ext.widget("panel", {
			title: s_currentLanguageTitle,
			autoScroll: true,
			cls: "x-ux-form-xpdlanguagepanel-form",
			bodyPadding: 20,

			language: s_currentLanguage,
			itemId: s_currentLanguage,

			layout: "anchor",

			lockId: s_lockId,
			fieldId: s_fieldId,

			isLocked: true,
			isMaster: (s_currentLanguage == s_primaryLanguage),

			value: null,

			listeners: {
				"afterrender": {
					fn: function (i_self) {
						i_self.setIconCls("ip2-icon-data-unknown");
					},
					single: true
				}
			},
			items: [
				{
					xtype: "container",
					itemId: s_lockId,
					layout: {
						type: "vbox",
						align: "center",
						pack: "center"
					},
					height: "100%",
					width: "100%",
					items: [
						{
							xtype: "fieldset",
							title: ip2.i18n({
								da: "Aktiver " + s_currentLanguageTitle.toLowerCase(),
								en: "Activate " + s_currentLanguageTitle.toLowerCase()
							}),
							width: 500,
							padding: "20 30",
							layout: "anchor",
							items: [
								{
									xtype: "quickcombo",
									itemId: "language",
									valueField: "value",
									displayField: "title",
									fields: ["title", "value"],
									editable: false,
									forceSelection: true,
									anchor: "100%",
									margin: "0 0 10px 0",
									isFormField: false,
									data: (function () {

										var a_languages = i_cmp.languages;
										var a_data = [];

										Ext.Array.each(a_languages, function (s_value) {
											if (s_value != s_currentLanguage) {
												var s_title = wsh.i18n.getEnum(s_value);
												a_data.push({
													title: s_title,
													value: s_value
												});
											}
										});

										a_data.push({
											title: ip2.i18n({
												da: "Uden indhold",
												en: "Without content"
											}),
											value: 0
										});

										return a_data;
									})(),
									labelWidth: 160,
									fieldLabel: ip2.i18n({
										da: "Kopier indhold fra",
										en: "Copy content from"
									}),
									labelAlign: "top",
									listeners: {
										afterrender: {
											fn: function (i_self) {
												var s_value = i_cmp.defaultLanguage;
												i_self.setValue(s_value);
											}
										},
										change: {
											fn: function (i_self, s_lang) {

												if (i_controller) {
													var i_button = i_controller.down("#data");
													i_button.language = s_lang;
												}
											}
										}
									}
								},
								{
									xtype: "button",
									itemId: "data",
									language: s_primaryLanguage,
									width: 120,
									style: "float: right;",
									text: ip2.i18n({
										da: "Aktiver",
										en: "Activate"
									}),
									handler: function () {

										var i_self = this;
										var s_lang = i_self.language;
										var i_controller = i_self.up("#" + s_currentLanguage);
										var i_master = i_cmp.down("#" + s_lang);

										if (!i_master) {
											i_controller.unlockField();
										}
										else {
											var o_value = i_master.getValue();

											if (!o_value) {

												var s_languageTitle = wsh.i18n.getEnum(s_lang);
												ip2.messageBox({
													message: ip2.i18n({
														da: "Der er ingen værdier at hente fra " + s_languageTitle,
														en: "No values to copy from " + s_languageTitle
													})
												});
											}
											else {
												i_controller.unlockField(o_value, true);
											}
										}
									}
								}
							]
						}
					]
				}
			],
			getField: function () {

				var i_self = this,
					s_id = i_self.fieldId;

				return i_self.down("#" + s_id);
			},
			getLock: function () {

				var i_self = this,
					s_id = i_self.lockId;

				return i_self.down("#" + s_id);
			},
			lockField: function () {

				var i_self = this,
					i_field = i_self.getField();
				i_lock = i_self.getLock();

				// Kill the xpd field if present
				if (i_field) {
					i_field.destroy();
				}

				i_lock.show();

				i_self.isLocked = true;

				i_self.syncTabIcon();
			},
			unlockField: function (o_value, b_dirty) {

				var i_self = this;
				var s_language = i_self.language;

				o_value = o_value || i_self.value;

				if (!o_value) {
					o_value = (function () {

						var o_return = {};
						var s_idProperty = i_cmp.xpdCollection.idProperty;
						var s_language = i_cmp.defaultLanguage;
						var o_value = Ext.decode(i_cmp.value);

						o_return[s_idProperty] = o_value[s_language][s_idProperty];

						return o_return;
					})();
				}

				var s_value = Ext.encode(o_value);

				var i_field = i_self.getField(),
					i_lock = i_self.getLock();

				if (!i_field) {

					var s_xpd = i_cmp.xpd;
					var i_dataParent = i_cmp.dataParent;

					i_field = i_self.add({
						xtype: "xpdfield",
						itemId: i_self.fieldId,
						xpd: s_xpd,
						environment: "editor",
						dataParent: i_dataParent,
						language: i_self.language,
						//language: ip2.session.getLanguage(),
						isFormField: false,
						value: b_dirty ? "" : s_value,
						anchor: "100%",
						listeners: {
							"dirtychange": function (i_field, b_dirty) {
								i_self.syncTabIcon();
								i_cmp.checkChange();
							},
							"validitychange": function (i_field, b_valid) {
								i_self.syncTabIcon();
								i_cmp.checkChange();
							}
						}
					});
				}
				else {
					i_field.setValue(s_value);
					i_field.resetOriginalValue();
				}

				if (b_dirty) {
					i_field.setValue(s_value);
				}

				i_lock.hide();
				i_field.show();

				i_self.isLocked = false;

				i_self.syncTabIcon();
			},
			isValid: function () {

				var i_self = this,
					i_field = i_self.getField(),
					b_locked = i_self.isLocked;

				return b_locked ? true : i_field.isValid();
			},
			isDirty: function () {

				var i_self = this;
				var i_field = i_self.getField();
				var b_locked = i_self.isLocked;

				return b_locked ? false : i_field.isDirty();
			},
			syncTabIcon: function () {

				var i_self = this,
					i_tab = i_self.tab,
					b_locked = i_self.isLocked;

				if (!i_tab.getEl()) {
					i_self.on({
						"afterrender": {
							fn: function (i_self) {
								i_self.syncTabIcon();
							},
							single: true,
							scope: i_self
						}
					});
				}

				if (b_locked) {
					i_tab.setIconCls("ip2-icon-data-lock");
				}
				else {

					if (!i_self.isValid()) {
						i_self.tab.setIconCls("flatiu icon-data-error");
					}
					else if (i_self.isDirty()) {
						i_self.tab.setIconCls("flatiu icon-data-new");
					}
					else {
						i_self.tab.setIconCls("");
					}
				}
			},
			getDataValue: function () {

				var i_self = this,
					o_value = i_self.getValue(),
					o_dataValue = null;

				if (o_value) {
					o_dataValue = {};
					o_dataValue[i_self.itemId] = o_value;
				}

				return o_dataValue;
			},
			getValue: function () {

				var i_self = this,
					i_field = i_self.getField(),
					o_value = null,
					s_value;

				if (i_field) {
					s_value = i_field.getValue();
				}

				if (s_value) {
					o_value = Ext.decode(s_value);
				}

				return o_value;
			},
			setValue: function (o_value) {

				var i_self = this,
					i_field = i_self.getField();

				i_self.value = o_value;

				if (!i_field) {

					if (o_value) {
						i_self.unlockField(o_value);
					}
				}
				else {
					if (o_value) {
						var s_value = Ext.encode(o_value);
						i_field.setValue(s_value);
					}
					else {
						i_self.lockField();
					}
				}

				return i_self;
			},
			resetOriginalValue: function () {

				var i_self = this,
					i_field = i_self.getField();

				if (i_field) {
					i_field.resetOriginalValue();
				}
			}
		});

		return i_controller;
	},

	getValue: function () {

		var i_cmp = this;
		var o_languageControllers = i_cmp.languageControllers;
		var o_values = {};

		Ext.Object.each(o_languageControllers, function (s_language, i_wrapper) {

			var o_value = i_wrapper.getValue();

			if (o_value) {
				o_values[s_language] = o_value;
			}
		});

		var s_value = "";

		if (Ext.Object.getSize(o_values)) {
			s_value = Ext.encode(o_values);
		}

		return s_value;
	},
	setValue: function (value) {

		var i_cmp = this,
			o_controllers = i_cmp.languageControllers,
			o_values;

		o_values = value ? Ext.decode(value) : {};

		Ext.Object.each(o_controllers, function (s_language, i_wrapper) {
			i_wrapper.setValue(o_values[s_language]);
		});

		return i_cmp.mixins.field.setValue.call(i_cmp, value);
	},
	resetOriginalValue: function () {

		var i_cmp = this,
			o_controllers = i_cmp.languageControllers;

		Ext.Object.each(o_controllers, function (s_language, i_wrapper) {
			i_wrapper.resetOriginalValue();
		});

		return i_cmp.mixins.field.resetOriginalValue.call(i_cmp);
	},
	isDirty: function() {

		var i_cmp = this,
			b_dirty = false,
			o_controllers = i_cmp.languageControllers;

		Ext.Object.each(o_controllers, function (s_language, i_wrapper) {
			if (i_wrapper.isDirty()) {
				b_dirty = true;
				return false;
			}
		});

		return b_dirty;
	},
	isValid: function () {

		var i_cmp = this,
			b_valid = true,
			o_controllers = i_cmp.languageControllers;

		Ext.Object.each(o_controllers, function (s_language, i_wrapper) {
			if (!i_wrapper.isValid()) {
				b_valid = false;
				return false;
			}
		});

		return b_valid;
	}
});
