(function () {
	var Dom = YAHOO.util.Dom,
		Region = YAHOO.util.Region,
		Event = YAHOO.util.Event,
		Resize = YAHOO.util.Resize,
		TabView = YAHOO.widget.TabView,
		Panel = YAHOO.widget.Panel,
		tabView,
		panel1,
		panel2,
		panel3,
		panel4,
		panel1_region,
		panel2,
		panel3,
		panel4,
		tab1,
		tab2,
		tab3,
		tab4,
		resize1,
		resize2,
		resize3,
		resize4,
		toggle = false;
		
		Event.onDOMReady(function () {
			tabView = new TabView('demo');
			panel1 = new Panel("panel1", {
				draggable: true,
				width: "200px",
				height: "150px",
				autofillheight: "body",
				constraintoviewport: true,
				context: [Dom.getPreviousSibling('panel1'), "tl", "bl"]
			});
			panel1.render();
			
			resize1 = new Resize('panel1', {
				handles: ['br'],
				autoRatio: false,
				minWidth: 100,
				minHeight: 50,
				status: false
			});
			
			resize1.on('resize', function(args) {
				var panelHeight = args.height;
				this.cfg.setProperty("height", panelHeight + "px");
			}, panel1, true);
			
			resize1.on('startResize', function(args) {
			
			        resize1.set("maxWidth", tab1.right - panel1_region.left);
			        resize1.set("maxHeight", tab1.bottom - panel1_region.top);
			    
			}, panel1, true);

			tab1 = Region.getRegion(Dom.get('tab1'));
			panel1_region = Region.getRegion(Dom.get('panel1'));
			
//		    alert(tab1.right + ' and ' +  panel1_region.left);
			
			panel1.dragEvent.subscribe(function (e, o) {
				panel1.dd.setYConstraint(tab1.top - panel1_region.top + 50, tab1.bottom - panel1_region.bottom);
				panel1.dd.setXConstraint(tab1.left - panel1_region.left, tab1.right - panel1_region.right);
			});

		});
}());