 Ext.define("Portfolio.designer.ui.domainModelLanguageGrid", {

	extend: "Ext.grid.Panel",

	alias: [
		"widget.ip2DomainModelLanguageGrid"
	],

	border: 0,

	autoScroll: true,

	requires: [
		"Portfolio.designer.model.domainModelLanguageManagerDataModel",
		"Ext.ux.form.field.LocaleComboBox"
	],

	initComponent: function() {

		var i_self = this;

		// grid columns
		i_self.columns = [
			{
				header: ip2.i18n("languageCode"),
				dataIndex: "code",
				editor: {
					xtype: "ip2LocaleLanguageComboBox",
					matchFieldWidth: false,
					listConfig: {
						width: 300
					}
				}
			},
			{
				header: ip2.i18n("description"),
				flex: 3,
				renderer: i_self.languageDescriptionRenderer
			}
		];

		// grid store
		var data = [];

		Ext.Object.each(i_self.designer.model.languages, function(s_language) {
			var o_language = i_self.designer.model.languages[s_language];
			if (o_language) {
				if (o_language.text) {
					data.push({
						code: s_language
					});
				}
			}
		});

		var store = Ext.create("Ext.data.Store", {
			model: "Portfolio.designer.model.domainModelLanguageManagerDataModel",
			data: data
		});

		i_self.store = store;

		// grid plugins (cell editor)
		i_self.plugins = Ext.create("Ext.grid.plugin.CellEditing", {
			pluginId: "celledit",
			clicksToEdit: 1,
			listeners: {
				edit: {
					fn: function(i_editor, i_context) {

						var i_record = i_context.record;
						i_record.commit();

						i_self.fireEvent("languagechange", i_self, i_self.isDirty());
					}
				}
			}
		});

		// Rows listeners
		var rowMenu = Ext.create("Ext.menu.Menu", {
			items: [
				{
					xtype: "menuitem",
					text: ip2.i18n({
						da: "Slet",
						en: "Delete"
					}),
					iconCls: "pf-delete",
					handler: function() {
						i_self.deleteRow();
					}
				}
			]
		});

		i_self.listeners = {
			itemcontextmenu: function(view, record, item, index, e) {
				e.stopEvent();
				var coords = e.getXY();
				rowMenu.showAt([coords[0], coords[1]]);
			}
		};

		// toolbar
		i_self.tbar = [{
			xtype: "button",
			text: ip2.i18n({
				da: "Tilføj",
				en: "Add"
			}),
			iconCls: "pf-add",
			handler: function() {
				var store = i_self.getStore();
				var model = store.proxy.getModel();
				var record = model.create({});
				store.add(record);

				var plugin = i_self.getPlugin("celledit");
				plugin.startEditByPosition({ row: store.count() -1, column: 0 });

				if(!i_self.wasDirty) {
					i_self.fireEvent("languagechange", me, true);
					i_self.wasDirty = true;
				}

			}
		}];

		i_self.callParent();
		i_self.resetOriginalValue();
		i_self.enableBubble("languagechange");
	},
	languageDescriptionRenderer: function(v, meta, record) {
		return v;
	},

	getValue: function() {

		var i_self = this;
		var value;

		var a_records = i_self.store.getRange();
		var a_value = [];

		Ext.Array.each(a_records, function(i_record) {
			a_value.push(i_record.data);
		});

		i_self.value = value = Ext.encode(a_value);
		return value;
	},

	isDirty: function() {

		var i_self = this;
		var value = i_self.getValue();
		var b_dirty = i_self.originalValue != value;
		i_self.wasDirty = b_dirty;
		return b_dirty;
	},

	resetOriginalValue: function() {

		var i_self = this;

		var a_records = i_self.store.getRange();
		var a_value = [];

		Ext.Array.each(a_records, function(i_record) {
			a_value.push(i_record.data);
		});

		i_self.originalValue = i_self.value = Ext.encode(a_value);
		i_self.wasDirty = false;
	},

	deleteRow: function() {

		var i_self = this;

		ip2.messageBox({
			title: ip2.i18n("confirmDeleteTitle"),
			message: ip2.i18n("confirmDelete"),
			yesFn: function () {
				var a_records = i_self.getSelectionModel().getSelection();
				i_self.store.remove(a_records);

				i_self.fireEvent("languagechange", i_self, i_self.isDirty());
			},
			yesText: ip2.i18n({
				da: "Ok",
				en: "OK"
			}),
		});
	}
  });
