/*jslint laxbreak:true */
/*jslint laxcomma:true */
/*jslint loopfunc:true */
/*jslint strict:true */
/*jslint browser:true */
/*jslint devel:true */

define([
	"underscore"
	, "jquery"
	, "backbone"

	, "views/browser"
	, "views/list"

	, "text!../../templates/client/layout.html"

	, "jquery-layout"
]
, function (
_
, $
, Backbone

, BrowserView
, ListView

, tmplClientLayout
) {
	"use strict";

	var Client	= Backbone.View.extend({
		el:				$(tmplClientLayout)

		, client:		null

		, layout:		null

		, browserView:	null

		, listView:		null

		, initialize:	function (client) {
			var that		= this
			,	container	= document.createElement("div")
			;

			that.el.id		= "__view-" + client.attributes.hostname.replace(".", "_");

			Client.__super__.initialize.apply(that);

			that.client	= client;

			that.layout	= that.$el.find("> div").layout({
				defaults:		{
					closable:			false
					, resizable:		true
					, slidable:			true
					, spacing_open:		5
					, spacing_closed:	5
				}

				, north:		{
					minSize:			100
					, size:				200
					, closable:			true
				}

				, center:		{
					minSize:			200
				}
			});

			that.browserView	= new BrowserView({
				el:		that.layout.panes.north
				, client:	that.client
			});

			that.ListView		= new ListView({
				el:			that.layout.panes.center
				, client:	that.client
			});

		}
	});

	return Client;
});

/*

that.layoutItems	= $(that.layout.panes.center).layout({
	defaults:		{
		closable:			false
		, resizable:		true
		, slidable:			true
		, spacing_open:		5
		, spacing_closed:	5
	}

	, north:		{
		minSize:			100
		, size:				200
		, closable:			true
		//, onresize:			function (pane, $pane, state, options) {
		//						var viewportHeight	= $pane.innerHeight() - App.BrowserView.$el.find(".dataTables_scrollHead").height();
		//						App.BrowserView.$el.find(".dataTables_scrollBody").height(viewportHeight);
		//						//App.BrowserView.reDraw();
		//					}
	}

	, center:		{
		minSize:			200
		//, onresize:			function (pane, $pane, state, options) {
		//						var viewportHeight	= $pane.innerHeight() - App.ListView.$el.find(".dataTables_scrollHead").height();
		//						App.ListView.$el.find(".dataTables_scrollBody").height(viewportHeight);
		//						//App.ListView.render();
		//					}
	}
});
 */