//initialise the docking boxes manager
var manager = new dbxManager(
	'idcolumns-controls',	// session ID [/-_a-zA-Z0-9/]
	'yes',			// enable box-ID based dynamic groups ['yes'|'no']
	'yes',			// hide source box while dragging ['yes'|'no']
	'button'		// toggle button element type ['link'|'button']
	);





//create new docking boxes group
var purple = new dbxGroup(
	'purple', 		// container ID [/-_a-zA-Z0-9/]
	'vertical', 	// orientation ['vertical'|'horizontal'|'freeform'|'freeform-insert'|'confirm'|'confirm-insert']
	'7', 			// drag threshold ['n' pixels]
	'no',			// restrict drag movement to container/axis ['yes'|'no']
	'10', 			// animate re-ordering [frames per transition, or '0' for no effect]
	'yes', 			// include open/close toggle buttons ['yes'|'no']
	'open', 		// default state ['open'|'closed']

	'open', 		// word for "open", as in "open this box"
	'close', 		// word for "close", as in "close this box"
	'click-down and drag to move this box', // sentence for "move this box" by mouse
	'click to %toggle% this box', // pattern-match sentence for "(open|close) this box" by mouse
	'use the arrow keys to move this box. ', // sentence for "move this box" by keyboard
	'press the enter key to %toggle% this box. ',  // pattern-match sentence-fragment for "(open|close) this box" by keyboard
	'%mytitle%  [%dbxtitle%]' // pattern-match syntax for title-attribute conflicts
	);



//additional custom scripting for the controls form
//this is only a basic demo script, and doesn't validate the field values
//or whether the objects referred to actually exist
var frm = document.getElementById('moveform');
if(frm)
{
	//bind a submit handler
	frm.onsubmit = function()
	{
		//get the box reference and split by commas
		var ref = this['ref'].options[this['ref'].options.selectedIndex].value.split(',');

		//get the value of the fn selector
		var fn = this['fn'].options[this['fn'].options.selectedIndex].value;

		//for each box reference
		for(var i=0; i<ref.length; i++)
		{
			//switch by the value of the fn selector
			//there's no need to test these against manager.supported
			//because the functions themselves will handle that
			switch(fn)
			{
				//open a box
				case 'open' :
					purple.toggle(ref[i], 'open');		//also supports (ref, true)
					break;

				//close a box
				case 'close' :
					purple.toggle(ref[i], 'close');		//also supports (ref, false)
					break;

				//toggle a box
				case 'toggle' :
					purple.toggle(ref[i], 'toggle');	//also supports (ref, null) or (ref)
					break;

				//move a box down
				case 'movedown' :
					purple.move(ref[i], 'down');		//also supports (ref, true) or (ref)
					break;								//or (ref, 'S') or (ref 'E') or (ref 'right')

				//move a box up
				case 'moveup' :
					purple.move(ref[i], 'up');			//also supports (ref, false)
					break;								//or (ref, 'N') or (ref 'W') or (ref 'left')
			}
		}

		//don't submit the form in the normal way
		return false;
	};
}