/*
 *  Standard Javascript code for Hand Made Basin Company
 *
 * Brian Gillespie 2006
 * Released under the terms of the GNU GPL: http://www.gnu.org/licenses/gpl.html
**/

var HandMadeBasin = {
	
	/**
	 * Standard colours used in the site
	 */
	colours: {
		menuBg:       '#a29a78',
		menuStripe:   '#beccdf',
		
		pageBg:       '#ecebe4',
		pageText:     '#635f73',
		pageLink:     '#3089c4',
		
		squareBorder: '#a29a78',
		roundBorder:  '#6cb9db',
		borderBg:     '#f6f6f2',
		
		footerBg:     '#f1f0eb',
		footerText:   '#b9b399'
	},
	
	// the prefix of the name of "order" form fields
	formOrderPrefix: 'ongoing_',
	choiceItemPrefix: 'choice_',
	
	sinkParts: ['unit', 'glaze', 'stencil'],
	
	
	/**
	 * Round the corners of a layer by putting images at the corners of the given
	 * object and create an inner layer for content. It was attempted to use
	 * padding for the content, but this led to box model problems when the
	 * content was larger than the box. The content from the original layer is
	 * moved into the inner layer.
	 * @param obj handle of the object (layer) to add the corners to
	 * @param sideLen side length of the square images to place at corners
	 * @param baseUrl path of images plus first part of name; images must be
	 * 	named '<something>tl.<ext>', '<something>tr.<ext>' etc.
	 * @param imgType extension of the image filename. Default is '.png'
	 * @param w object's width (for compatibility with Safari)
	 * @param h object's height (for compatibility with Safari)
	 * @param bordWidth width of the border, in pixels. Default is 1.
	 */
	roundRect: function(
			obj, sideLen, baseUrl, imgType, w, h, bordWidth, overflow
	) {
		
		var styles, i, corner, content;
		
		// make sure the overflow is set
		if (!overflow) overflow = 'auto';
		
		// get width and height if not specified. NB: this doesn't work on Safari
		if (!w || !h) {
			w = obj.clientWidth;
			h = obj.clientHeight;
		}
		
		// assume 1 pixel border width if not specified
		if (!bordWidth) bordWidth = 1;
		bordWidth = (-bordWidth) + 'px';
		
		content = obj.innerHTML;
		obj.innerHTML = '';
		obj.style.overflow = 'visible';
		
		if (!baseUrl) baseUrl = 'images/rr_'; // base url of corner imgs
		if (!imgType) imgType = '.png';       // image type
		
		// ensure imgType begins with a dot
		if (!/^\./.test(imgType)) imgType = '.' + imgType;
		
		var nameParts = [  'tl',    'tr',     'bl',     'br'];
		var yParts    = [ 'top',   'top', 'bottom', 'bottom'];
		var xParts    = ['left', 'right',   'left',  'right'];
		
		// create and append the four corners
		for (i = 0; i < 4; i++) {
			corner            = document.createElement('div');
			corner.id         = obj.id + '_' + nameParts[i];
			styles            = corner.style;
			styles.position   = 'absolute';
			styles.display    = 'block';
			styles.fontSize   = '1px';
			styles.margin     = '0px';
			styles.padding    = '0px';
			styles[yParts[i]] = bordWidth;
			styles[xParts[i]] = bordWidth;
			styles.width      = sideLen + 'px';
			styles.height     = sideLen + 'px';
			styles.backgroundImage =
					'url("' + baseUrl + nameParts[i] + imgType + '")'
			;
			// TEST: styles.backgroundColor = '#00ff00';
			obj.appendChild(corner);
		}

		// now do the content container (recycle 'corner' variable!)
		corner              = document.createElement('div');
		styles              = corner.style;
		styles.position     = 'absolute';
		styles.display      = 'block';
		styles.margin       = '0px';
		styles.padding      = '0px';
		styles.paddingRight = '3px';
		styles.top          = Math.floor(sideLen / 2) + 'px';
		styles.left         = Math.floor(sideLen / 2) + 'px';
		styles.width        = (w - sideLen - 3) + 'px';
		styles.height       = (h - sideLen) + 'px';
		styles.overflow     = overflow;
		// TEST: alert("W: " + styles.width + " , H: " + styles.height);
		// TEST: styles.backgroundColor = '#0000ff';
		corner.id = obj.id + '_content';
		corner.innerHTML = content;
		obj.appendChild(corner);
		
		return null;
	},
	
	cookiesToForm: function() {
		gebi('cartContents'   ).value = CookieHandler.read('HMBC_cart'        );
		gebi('ongoing_unit'   ).value = CookieHandler.read('HMBC_specBasin'   );
		gebi('ongoing_glaze'  ).value = CookieHandler.read('HMBC_specGlaze'   );
		gebi('ongoing_stencil').value = CookieHandler.read('HMBC_specStencils');
		return null;
	},
	
	formToCookies: function() {
		CookieHandler.create('HMBC_cart'        , gebi('cartContents'   ).value, 86400000);
		CookieHandler.create('HMBC_specBasin'   , gebi('ongoing_unit'   ).value, 86400000);
		CookieHandler.create('HMBC_specGlaze'   , gebi('ongoing_glaze'  ).value, 86400000);
		CookieHandler.create('HMBC_specStencils', gebi('ongoing_stencil').value, 86400000);
		return null;
	},
	
	
	/*
	 * An object to help debugging
	 */
	JSConsole: {
		
		
		insert: function() {
			document.write([
					"<a accesskey='s' onclick='HandMadeBasin.JSConsole.show()'>Show</a>",
					"<a accesskey='h' onclick='HandMadeBasin.JSConsole.hide()'>Hide</a>",
					"<div style='position: absolute; top: 10px; left: 10px; ",
					"width:100%; height:72px; z-index:100' id='console_shell'>",  
					"<textarea rows='10' cols='40'",
					"onblur='HandMadeBasin.JSConsole.execute(this)'></textarea>",
					"<br>",
					"<textarea disabled rows='10' cols='40' id='console_results'>", 
					"</textarea></div>"
			].join('\n'));
		},
		
		
		execute: function(obj) {
			var rez = document.getElementById('console_results');
			if (!rez) throw "couldn't show results";
			
			var p;
			
			try {
				p = eval(obj.value);
				rez.value = p;
				rez.style.backgroundColor = '#ffffff';
			} catch (e) {
				p = [];
				for (var i in e)
					p.push(i + ':' + e[i]);
				rez.style.backgroundColor = '#ffeeee';
				rez.value = p.join('\n');
			}
		},
		
		
		show: function() {
			document.getElementById('console_shell'  ).style.display = 'block';
			document.getElementById('console_results').style.display = 'block';
		},
		
		
		hide: function() {
			document.getElementById('console_shell'  ).style.display = 'none';
			document.getElementById('console_results').style.display = 'none';
		}
	}
}


Object.prototype.getPropertiesList = function() {
	var p = [];
	for (var i in this)
		p.push(i + ':' + this[i]);
	return p.join("\n");
}

/*
 * IE5 arrays don't have shift or push!
 */

if (!Array.prototype.shift) Array.prototype.shift = function() {
	if (this.length == 0) return;
	var item = this[0];
	for (var i = 0; i < this.length - 1; i++)
		this[i] = this[i + 1];
	this.length--;
	return item;
}

if (!Array.prototype.push) Array.prototype.push = function() {
	for (var i = 0; i < arguments.length; i++)
		this[this.length] = arguments[i];
}


// get element by id
function gebi(id) {
	return document.getElementById ? document.getElementById(id) : document.all[id];
}