Ext.define("Portfolio.designer.ui.require.view.Manager", {
	extend: "Ext.panel.Panel",
	layout: "fit",
	alias: "widget.designer.ui.require.manager",
	config: {
		designer: null,
		grid: null
	},
	requires: [
		"Portfolio.designer.ui.require.model.Manager"
	],

	initComponent: function() {

		var i_self = this;
		i_self.callParent(arguments);
		i_self.add(i_self.createLayout());
		return i_self;
	},

	createLayout: function() {

		var i_self = this;
		var o_designer = i_self.getDesigner() || {
			model: {
				require: []
			}
		};

		var a_items = [];
		var a_data = [];

		var i_store = Ext.create("Ext.data.Store", {
			model: "Portfolio.designer.ui.require.model.Manager"
		});

		var i_model = i_store.getModel();

		Ext.Array.each(o_designer.model.require, function(s_require) {

			var s_values = s_require;

			var i_record = i_model.create({
				path: s_require
			});

			a_data.push(i_record);
		});

		i_store.loadData(a_data);

		var i_grid = Ext.widget("gridpanel", {
			store: i_store,
			plugins: {
				ptype: 'cellediting',
				clicksToEdit: 1
			},
			columns: [
				{
					dataIndex: "path",
					flex: 1,
					header: ip2.i18n({
						da: "Fil sti",
						en: "File path"
					}),
					editor: {
						xtype: "textfield"
					}
				}
			],
			listeners: {
				itemcontextmenu: {
					fn: function(i_view, i_record, i_item, n_index, i_event) {

						i_event.preventDefault();

						i_view.getSelectionModel().select(n_index);

						var a_coords = i_event.getXY();

						var i_menu = Ext.create('Ext.menu.Menu', {
							items: [
								{
									xtype: "button",
									text: ip2.i18n({
										da: "Slet",
										en: "Delete"
									}),
									iconCls: "pf-navigate_cross",
									handler: function() {

										var i_grid = i_self.getGrid();

										var i_store = i_grid.getStore();
										i_store.remove(i_record);

										i_self.setSelected(null);
									}
								}
							]
						});

						i_menu.showAt([a_coords[0], a_coords[1]]);
					}
				}
			}
		});

		var i_toolbar = Ext.widget("toolbar", {
			dock: "top",
			items: i_self.createButtons()
		});

		i_grid.addDocked(i_toolbar);

		a_items.push(i_grid);

		i_self.setGrid(i_grid);

		return a_items;
	},

	createButtons: function() {

		var i_self = this;
		var a_items = [];

		var i_button = Ext.widget("button", {
			iconCls: "pf-add",
			text: ip2.i18n({
				da: "Tilføj",
				en: "Create"
			}),
			handler: function(i_button) {

				var i_grid = i_self.getGrid();
				var i_store = i_grid.getStore();
				var i_model = i_store.getModel();
				var i_record = i_model.create({
					path: ""
				});
				i_store.loadData([i_record], true);
			}
		});
		a_items.push(i_button);
		return a_items;
	},

	doSave: function() {

		var i_self = this;
		var i_grid = i_self.getGrid();
		var i_store = i_grid.getStore();
		var a_records = i_store.getRange();

		var a_requires = [];

		Ext.Array.each(a_records, function(i_record) {

			a_requires.push(i_record.get("path"));
		});

		return a_requires;
	}
});
