
/**
 * UI Layout
 * @class UI.Layout
 * @implements {Events, Options}
 */
UI.Layout = new Class({

	Implements: [Events, Options],

	/**
	 * Layout options
	 * @type {Object}pack
	 * @param {name} [name] layout
	 * @param {Object} [clss] Default component class
	 */
	options: {
		name: 'layout',
		clss: 'UI.Container',
		settings: {}
	},

	/**
	 * [initialize description]
	 * @param  {[type]} options [description]
	 * @return {[type]}         [description]
	 */
	initialize: function(options){
		this.setOptions(options);

		this._initLayout(this.options);

		return this;
	},

	/**
	 * [_initLayout description]
	 * @return {[type]} [description]
	 */
	_initLayout: function(opts) {
		//_log('initialize', opts);
		var node = opts.node;
		this.settings = opts.settings || {};
		this.component = {};
		this.components = [];
		this.resizer = {};

		this._initContainer(opts);
		this._processComponents(node);
		this._initEvents();
	},

	/**
	 * [_initEvents description]
	 * @param  {[type]} opts [description]
	 * @return {[type]}      [description]
	 */
	_initEvents: function(opts) {
		var self = this;

		window.addEvent('resize', function() {
			//_log('layout resize', this.container.getCoordinates());
			var coord = self.container.getCoordinates();
			if (coord.width < 720 && self.navi) {
				self.navi.minimize();
				//self.resizer.navi.hide();
			}
			//self.layout.fireEvent('resize');
		});
	},

	/**
	 * [_initContainer description]
	 * @return {[type]} [description]
	 */
	_initContainer: function(opts) {

		this.container = new UI.Container({
			resizable: false,
			'class': 'ui-layout layout-' + opts.node._name
		}).inject(opts.container);


/*		this.map = new UI.Container({
			resizable: false,
			'class': 'ui-map map-' + opts.node._name
		});*/

		//_log('Layout container', this.container);

		this.container.addClass('ui-layout');
		this.container.addClass('layout-' + opts.node._name);

		opts.node.container = this.container;
	},

	/**
	 * [_process description]
	 * @param  {[type]} mnml [description]
	 * @return {[type]}      [description]
	 */
	_processComponents: function(node, type, level) {
		//_log('_process', node);
		var list = node._list || [];
			level = level++ || 1;

		for (var i = 0, len = list.length; i < list.length; i++) {
			//_log('--', list[i]);
			var name = list[i],
				comp = node[name] || {};

			comp.clss = comp.clss || this.options.clss;
			comp.opts = comp.opts || {};
			comp.opts.name = name;
			comp.opts.position = i + 1;
			comp.opts.nComp = list.length;

			if (i == list.length - 1) {
				//console.log('last--', name);
				comp.opts.last = true;
			}

			if (type != 'tab') {
				comp.opts.container = node.container;
			}

			var component = this._initComponent(comp);

			if (type == 'tab') {
				//console.log('tab', component);
				component.options.noResizer = true;
				node.container.addTab(component);
			}

			component.element.addClass('container-'+name);

			if (comp.node) {
				comp.node.container = component;

				if (component.options.clss == 'tab') {
					var c = this._processComponents(comp.node, 'tab');
				} else {
					this._processComponents(comp.node);
				}
			}
		}
	}
});

@@ -2150,19 +2150,32 @@
 s', node
+, type, level
 );%0A
-
 %09%09var li
@@ -2363,16 +2363,17 @@
 %7C%7C %7B%7D;%0A%0A
+%0A
 %09%09%09comp.
@@ -2500,16 +2500,16 @@
  i + 1;%0A
-
 %09%09%09comp.
@@ -2535,16 +2535,75 @@
 ength;%0A%0A
+%0A%09%09%09if (name == %22navi%22)%0A%09%09%09%09comp.opts.useUnderlay = true;%0A%0A
 %09%09%09if (i
@@ -3234,15 +3234,112 @@
 %09%09%7D%0A%09%09%7D%0A
+%09%7D,%0A%0A%09setDevice: function(device) %7B%0A%09%09this.device = device;%0A%0A%09%09this.fireEvent('device', device);%0A
 %09%7D%0A%7D);%0A

add setDevice method