Ext.define("Portfolio.top.view.Settings", {

	extend: "Ext.window.Window",

	xtype: "portfolio-settings",

	layout: "fit",

	modal: true,

	config: {
		footer: null,
		form: null
	},

	requires: [
		"Portfolio.top.controller.Settings"
	],

	listeners: {
		afterrender: {
			fn: "onAfterRender"
		},
		beforedestroy: {
			fn: "onDestroy"
		}
	},

	ui: "message",

	controller: "portfolio-settings",

	initComponent: function() {

		var i_self = this;
		i_self.callParent(arguments);

		i_self.add(i_self.createForm());
	},

	createFields: function() {

		var i_user = ip2.getUser();

		var i_languageField = Ext.create("Ext.ux.form.field.LanguageComboBox", {
			fieldLabel: ip2.i18n({
				da: "Sprog",
				en: "Language"
			}),
			name: "USRLNG",
			value: i_user.get("USRLNG"),
			allowBlank: false,
			pageSize: 0,
		});

		var a_fields = [
			{
				xtype: "textfield",
				fieldLabel: ip2.i18n({
					da: "Bruger ID",
					en: "User ID"
				}),
				name: "USRID",
				readOnly: true,
				allowBlank: false
			},
			{
				xtype: "textfield",
				vtype: "email",
				fieldLabel: ip2.i18n({
					da: "Email",
					en: "Email"
				}),
				name: "USREML",
				allowBlank: false
			},
			i_languageField,
			{
				fieldLabel: ip2.i18n({
					da: "Profil billede",
					en: "Profile image"
				}),
				xtype: "uploadpicker",
				name: "USRIMG",
				path: "/images/profile",
				value: i_user.get("USRIMG"),
				extensions: Ext.ux.file.util.Handler.imageExtension,
				pageSize: 10
			}
		];

		return a_fields;
	},

	createForm: function() {

		var i_self = this;

		var i_panel = Ext.widget("form", {
			trackResetOnLoad: true,
			layout: "anchor",
			defaults: {
				labelAlign: "top",
				anchor: "100%"
			},
			items: i_self.createFields(),
			listeners: {
				validitychange: {
					fn: "onValidityChange"
				},
				dirtychange: {
					fn: "onDirtyChange"
				}
			}
		});

		i_panel.addDocked(i_self.createFooter());

		i_self.setForm(i_panel);

		return i_panel;
	},

	createFooter: function() {

		var i_self = this;

		var i_footer = Ext.widget("toolbar", {
			dock: "bottom",
			ui: "footer",
			defaults: {
				minWidth: 75
			},
			items: [
				"->",
				{
					xtype: "button",
					itemId: "button-close",
					text: ip2.i18n({
						da: "Annuller",
						en: "Cancel"
					}),
					handler: function () {

						i_self.close();
					}
				},
				{
					xtype: "button",
					itemId: "button-save",
					text: ip2.i18n({
						da: "Gem",
						en: "Save"
					}),
					hidden: true,
					handler: "onSave"
				}
			]
		});

		i_self.setFooter(i_footer);

		return i_footer;
	}
});
