Ext.define("IceCap.view.Emulator", {

	xtype: "icecap-emulator",

	extend: "Ext.panel.Panel",

	layout: "fit",

	stateful: true,

	stateId: "icecap-emulator",

	requires: [
		"IceCap.component.TabCloseMenu",
		"IceCap.controller.Emulator",
		"IceCap.view.Main"
	],

	config: {
		tabArea: null,
		toolBar: null,
		theme: "",
		scale: 14,
		options: {}
	},

	controller: "icecap.controller.emulator",

	stateEvents: [
		"add",
		"remove",
		"tabchange",
		"stateupdate"
	],

	initComponent: function() {

		var i_self = this;

		i_self.callParent(arguments);
		i_self.add(i_self.createTabArea());

		i_self.mon(IceCap.app, "stateReady", function() {

			var i_controller = i_self.getController();

			var o_state = Ext.state.Manager.get("icecap-emulator") || {
				tabs: []
			};

			if (o_state.tabs.length === 0) {
				i_controller.onNewSession();
			}
		});

		i_self.mon(IceCap.app, "toTab", function(i_item) {

			Ext.suspendLayouts();

			i_item.setResizeMode(1);

			var i_tabpanel = i_self.getTabArea();

			var i_active = i_tabpanel.add(i_item);

			i_tabpanel.setActiveItem(i_active);

			Ext.resumeLayouts(true);
		});
	},

	createTabArea: function() {

		var i_self = this;

		var i_controller = i_self.getController();

		var i_tabpanel = Ext.widget("tabpanel", {
			layout: "fit",
			plugins:[
				{
					ptype: "icecap-tabclosemenu",
					showCloseAll: false,
					showCloseOthers: false,
					listeners: {
						beforemenu: {
							fn: function (i_menu, i_item) {

								var a_items = i_menu.items.getRange();

								var i_panel = i_item;

								var i_menuItem = Ext.Array.findBy(a_items, function (i_item) {
									return i_item.itemId == "towindow";
								});

								if (i_menuItem) {
									i_menu.remove(i_menuItem);
								}

								i_menuItem = Ext.widget("menuitem", {
									text: "To Window",
									itemId: "towindow",
									handler: function (i_button) {
										IceCap.util.Handler.toWindow(i_panel);
									}
								});

								i_menu.add(i_menuItem);
							}
						}
					}
				}
			],
			tabBar: {
                items: [{
                    xtype: "button",
					text: "+ New session",
					ui: "icecap-tab-new",
					margin: "0px 0px 0px 10px",
					height: 40,
                    handler: function() {
                        i_controller.onNewSession();
                    }
                }]
			},
			bodyStyle: {
				"padding-top": "10px"
			},
			listeners: {
				afterrender: {
					fn: "onAfterRender"
				},
				add: {
					fn: "onStateNotify"
				},
				remove: {
					fn: "onStateNotify"
				},
				tabchange: {
					fn: "onStateNotify"
				}
			}
		});

		i_self.setTabArea(i_tabpanel);

		return i_tabpanel;
	},

	getState: function() {

		var i_self = this;

		var i_tabpanel = i_self.getTabArea();

		var o_state = {
			tabs: [],
			activeTabIndex: -1
		};

		var a_items = i_tabpanel.items.getRange();

		Ext.Array.each(a_items, function(i_panel) {

			var o_data = {};

			if (i_panel) {
				Ext.apply(o_data, i_panel.getState());
			}

			o_state.tabs.push(o_data);
		});

		if (a_items.length > 0) {
			o_state.activeTabIndex = i_tabpanel.items.indexOf(i_tabpanel.getActiveTab());
		}

		return o_state;
	},

	applyState: function(o_state) {

		var i_self = this;

		var i_tabpanel = i_self.getTabArea();

		Ext.applyIf(o_state, {
			tabs: [],
			activeTabIndex: -1
		});

		var a_items = [];

		if (o_state.tabs.length > 0) {

			Ext.Array.each(o_state.tabs, function(o_config) {

				var o_panel = Ext.apply({
					title: "Icecap",
					closable: true,
					theme: i_self.getTheme(),
					scale: i_self.getScale(),
					enterOnDblClick: false
				}, o_config.appConfig);

				var i_icecapPanel = Ext.widget("icecap-panel", o_panel);

				a_items.push(i_icecapPanel);
			});

			i_tabpanel.add(a_items);

			i_tabpanel.setActiveTab(o_state.activeTabIndex);
		}
	}
});
