// JavaScript 1.3

// FAT -- Form Automation Tools -- v 1.0
// JavaScript dialogs system file

// ST-OUT.com


//-----------------------------------------------------------------------------------------------------------------------------
//-----------------------------------------------------------------------------------------------------------------------------
//					dialogs functions & variables
//-----------------------------------------------------------------------------------------------------------------------------
//-----------------------------------------------------------------------------------------------------------------------------


//-----------------------------------------------------------------------------------------------------------------------------
//					public
//-----------------------------------------------------------------------------------------------------------------------------

// ------------- dialogShow ------------- //
// function		: shows or hides dialog
// arguments	: dialog type, field, [label, left, top]
//				  dialog type can be 'color', 'date'
// call			: dialogShow(myDialogType, myField, [myLabel, myLeft, myTop])
function dialogShow(myDialog, myField, myLabel, myLeft, myTop) {
	myZ = dialogZ;
	dialogZ += 1;
	if(dialogZ > dialogZMax) dialogZ = dialogZMin;
	myPos = Position.positionedOffset(myField);
	if(!myLeft) myLeft = myPos[0];
	if(!myTop) myTop = myPos[1];
	switch(myDialog) {
		case 'color' :
		if(!myLabel) myLabel = 'color picker';
		colorShowDiv(true, myZ, myLeft, myTop, myField, myLabel);
		break;
		case 'date' :
		if(!myLabel) myLabel = 'calendar';
		dateShowDiv(true, myZ, myLeft, myTop, myField, myLabel);
		break;
		case 'font' :
		if(!myLabel) myLabel = 'font';
		fontShowDiv(true, myZ, myLeft, myTop, myField, myLabel);
		break;
		case 'line' :
		if(!myLabel) myLabel = 'line style';
		lineShowDiv(true, myZ, myLeft, myTop, myField, myLabel);
	}
}


//-----------------------------------------------------------------------------------------------------------------------------
//					private
//-----------------------------------------------------------------------------------------------------------------------------

// ------------- variables ------------- //
// min & max z-index
var dialogZMin = 10;
var dialogZMax = 999;
var dialogZ;
// initialize color picker?
var colorActive = false;
// initialize date picker?
var dateActive = false;
// initialize font picker?
var fontActive = false;
// initialize line picker?
var lineActive = false;

// ------------- initDialogs ------------- //
// function		: initializes dialogs
function initDialogs() {
	dialogZ = dialogZMin;
	if(colorActive) initColor();
	if(fontActive) initFont();
	if(lineActive) initLine();
}



//-----------------------------------------------------------------------------------------------------------------------------
//-----------------------------------------------------------------------------------------------------------------------------
//					font functions & variables
//-----------------------------------------------------------------------------------------------------------------------------
//-----------------------------------------------------------------------------------------------------------------------------


//-----------------------------------------------------------------------------------------------------------------------------
//					public
//-----------------------------------------------------------------------------------------------------------------------------

// ------------- fontSubmit ------------- //
// function		: submit selected font
function fontSubmit(font) {
	// do someting ...
	// set selected font as value of active form field
	fontField.value = font;
	// hide font picker
	fontShowDiv(false);
	
	// private
	triggerEvent('change', fontField);
	triggerEvent('blur', fontField);
}


//-----------------------------------------------------------------------------------------------------------------------------
//					private
//-----------------------------------------------------------------------------------------------------------------------------

// ------------- variables ------------- //
// current form field
var fontField;

// ------------- initFont ------------- //
function initFont() {
	// write fonts
	fontMakeLib();
}

// ------------- fontShowDiv ------------- //
function fontShowDiv(myBool, myZ, myLeft, myTop, myField, myLabel) {
	if(myBool) {
		document.getElementById('dFontPicker').style.visibility = 'visible';
		document.getElementById('dFontPicker').style.display = 'block';
		document.getElementById('dFontPicker').style.zIndex = myZ;
		document.getElementById('dFontPicker').style.left = myLeft + 'px';
		document.getElementById('dFontPicker').style.top = myTop + 'px';
		document.getElementById('dFontLabel').innerHTML = myLabel;
		fontField = myField;
	}
	else {
		document.getElementById('dFontPicker').style.visibility = 'hidden';
		document.getElementById('dFontPicker').style.display = 'none';
	}
}

// ------------- fontMakeLib ------------- //
function fontMakeLib() {
	divString = '<table cellspacing="0" cellpadding="0">';
	for(i = 0; i < fonts.length; i++) {
		divString += '<tr><td><div class="fontLibItem" style="font-family: ' + fonts[i] + ';" onClick="fontSubmit(\'' + fonts[i] + '\');">' + fonts[i] + '</div></td></tr>';
	}
	divString += '</table>';
	document.getElementById('dFontPal').innerHTML = divString;
}



//-----------------------------------------------------------------------------------------------------------------------------
//-----------------------------------------------------------------------------------------------------------------------------
//					line functions & variables
//-----------------------------------------------------------------------------------------------------------------------------
//-----------------------------------------------------------------------------------------------------------------------------


//-----------------------------------------------------------------------------------------------------------------------------
//					public
//-----------------------------------------------------------------------------------------------------------------------------

// ------------- fontSubmit ------------- //
// function		: submit selected font
function lineSubmit(line) {
	// do someting ...
	// set selected font as value of active form field
	lineField.value = line;
	// hide font picker
	lineShowDiv(false);
	
	// private
	triggerEvent('change', lineField);
	triggerEvent('blur', lineField);
}


//-----------------------------------------------------------------------------------------------------------------------------
//					private
//-----------------------------------------------------------------------------------------------------------------------------

// ------------- variables ------------- //
// current form field
var lineField;

// ------------- initLine ------------- //
function initLine() {
	// write fonts
	lineMakeLib();
}

// ------------- lineShowDiv ------------- //
function lineShowDiv(myBool, myZ, myLeft, myTop, myField, myLabel) {
	if(myBool) {
		document.getElementById('dLinePicker').style.visibility = 'visible';
		document.getElementById('dLinePicker').style.display = 'block';
		document.getElementById('dLinePicker').style.zIndex = myZ;
		document.getElementById('dLinePicker').style.left = myLeft + 'px';
		document.getElementById('dLinePicker').style.top = myTop + 'px';
		document.getElementById('dLineLabel').innerHTML = myLabel;
		lineField = myField;
	}
	else {
		document.getElementById('dLinePicker').style.visibility = 'hidden';
		document.getElementById('dLinePicker').style.display = 'none';
	}
}

// ------------- lineMakeLib ------------- //
function lineMakeLib() {
	divString = '<table cellspacing="0" cellpadding="0">';
	for(i = 0; i < linestyles.length; i++) {
		divString += '<tr><td><div class="lineLibItem" style="border-style: ' + linestyles[i] + ';" onClick="lineSubmit(\'' + linestyles[i] + '\');">' + linestyles[i] + '</div></td></tr>';
	}
	divString += '</table>';
	document.getElementById('dLinePal').innerHTML = divString;
}



//-----------------------------------------------------------------------------------------------------------------------------
//-----------------------------------------------------------------------------------------------------------------------------
//					calendar functions & variables
//-----------------------------------------------------------------------------------------------------------------------------
//-----------------------------------------------------------------------------------------------------------------------------


//-----------------------------------------------------------------------------------------------------------------------------
//					public
//-----------------------------------------------------------------------------------------------------------------------------

// ------------- variables ------------- //
// date format -> possible entries:
// 'dayShort' = first 3 letters of weekday
// 'day' = weekday
// 'monthShort' = first 3 letters of month
// 'month' = month
// 'dd' = day of month (1-31)
// 'DD' = day of month (01-31)
// 'mm' = month (1-12)
// 'MM' = month (01-12)
// 'YYYY' = full year (e.g. 2004)
// 'YY' = year (e.g. 04)
// e.g.:
// var dateFormat = 'day YYYY/MM/DD';
var dateFormat = 'YYYY-MM-DD';
var datePreviewFormat = 'day, month dd YYYY';

// ------------- dateSubmit ------------- //
// function		: submit selected color
function dateSubmit() {
	// do someting ...
	// set selected date as value of active form field
	dateField.value = dateWriteString(dateSelected);
	// hide date picker
	dateShowDiv(false);
	
	// private
	triggerEvent('change', dateField);
	triggerEvent('blur', dateField);
}


//-----------------------------------------------------------------------------------------------------------------------------
//					private
//-----------------------------------------------------------------------------------------------------------------------------

// ------------- variables ------------- //
// current date
var dateSelected;
var datePreviewed;
// allowed delimiters in date format
var dateFormatDelim = new Array(' ', '<br />', ',', ';', ':', '.', '!', '?', '/', '\\', '-', '_', '|', '#', '(', ')', '{', '}', '[', ']', '<', '>');

// ------------- dateShowDiv ------------- //
function dateShowDiv(myBool, myZ, myLeft, myTop, myField, myLabel) {
	if(myBool) {
		document.getElementById('dDatePicker').style.visibility = 'visible';
		document.getElementById('dDatePicker').style.display = 'block';
		document.getElementById('dDatePicker').style.zIndex = myZ;
		document.getElementById('dDatePicker').style.left = myLeft + 'px';
		document.getElementById('dDatePicker').style.top = myTop + 'px';
		document.getElementById('dDateLabel').innerHTML = myLabel;
		dateField = myField;
		if(dateField) dateString = dateField.value;
		else dateString = '';
		if(dateField.value != '') dateSelected = dateReadString(dateField.value);
		else dateSelected = new Date();
		dateSet();
	}
	else {
		document.getElementById('dDatePicker').style.visibility = 'hidden';
		document.getElementById('dDatePicker').style.display = 'none';
	}
}

// ------------- dateChangeYear ------------- //
// function		: changes the year of the current date
function dateChangeYear(myYear) {
	dateSelected.setFullYear(myYear);
	datePreviewed.setFullYear(myYear);
	dateSet();
}

// ------------- dateChangeMonth ------------- //
// function		: changes the year of the current date
function dateChangeMonth(myMonth) {
	dateSelected.setMonth(myMonth);
	datePreviewed.setMonth(myMonth);
	dateSet();
}

// ------------- dateChangeDay ------------- //
// function		: changes the day of the current date
function dateChangeDay(myDay) {
	dateSelected.setDate(myDay);
	datePreviewed.setDate(myDay);
	document.getElementById('dDateSelect').innerHTML = dateWriteString(dateSelected, 'preview');
	dateMakeCal();
}

// ------------- datePreview ------------- //
// function		: previews a day
function datePreview(myDay) {
	datePreviewed.setDate(myDay);
	document.getElementById('dDateSelect').innerHTML = dateWriteString(datePreviewed, 'preview');
}

// ------------- dateSet() ------------- //
function dateSet() {
	document.getElementById('bDateYear').value = dateSelected.getFullYear();
	document.getElementById('bDateMonth').options[dateSelected.getMonth()].selected = 'selected';
	document.getElementById('dDateSelect').innerHTML = dateWriteString(dateSelected, 'preview');
	dateMakeCal();
}

// ------------- dateSetToday() ------------- //
function dateSetToday() {
	dateSelected = new Date();
	datePreviewed = new Date();
	dateSet();
}

// ------------- dateMakeCal() ------------- //
function dateMakeCal() {
	datePreviewed = dateSelected;
	divString = '';
	divString += '<table class="calendarSheet">';
	startDate = new Date(dateSelected.getFullYear(), dateSelected.getMonth(), 1);
	counter = 1 - startDate.getDay();
	cellCounter = 1;
	divString += '<tr>';
	for(i = 0; i < 7; i++) divString += '<td><b>' + days[i].substring(0, 1); + '</b></td>';
	divString += '</tr>';
	divString += '<tr>';
	while(counter <= 42) {
		if(counter < 1) divString += '<td></td>';
		else {
			checkDate = new Date(dateSelected.getFullYear(), dateSelected.getMonth(), counter);
			if(checkDate.getMonth() == dateSelected.getMonth()) {
				divString += '<td class="calendarDay">';
				if(checkDate.getDate() == dateSelected.getDate()) divString += '<a href="#" border="0" class="calendarLinkSelected" onClick="dateSubmit();" onMouseOver="datePreview(' + counter + ');">';
				else divString += '<a href="#" border="0" class="calendarLink" onClick="dateChangeDay(' + counter + '); dateSubmit();" onMouseOver="datePreview(' + counter + ');">';
				if(counter < 10) divString += '&nbsp;';
				divString += counter + '</a>';
				divString +='</td>';
			}
			else divString += '<td></td>';
		}
		if(cellCounter == 7) {
			cellCounter = 0;
			divString += '</tr><tr>';
		}
		counter += 1;
		cellCounter += 1;
	}
	divString += '</tr>';
	divString += '</table>';
	document.getElementById('dDateCal').innerHTML = divString;
}

// ------------- dateReadString ------------- //
// function		: reads date String as specified by dateFormat
// returns		: date object
function dateReadString(myString) {
	// strip date format of delimiters and put entries in array
	checkFormat = dateFormat;
	for(x = 0; x < dateFormatDelim.length; x++) if(checkFormat.indexOf(dateFormatDelim[x]) != -1) checkFormat = checkFormat.split(dateFormatDelim[x]).join('DELIM');
	while(checkFormat.indexOf('DELIMDELIM') > -1) checkFormat = checkFormat.split('DELIMDELIM').join('DELIM');
	checkFormat = checkFormat.split('DELIM');
	while(!checkFormat[0] || checkFormat[0] == '') checkFormat.shift()
	while(!checkFormat[checkFormat.length - 1] || checkFormat[checkFormat.length - 1] == '') checkFormat.pop();
	// strip date string of delimiters and put entries in array
	checkDate = myString;
	for(x = 0; x < dateFormatDelim.length; x++) if (checkDate.indexOf(dateFormatDelim[x]) != -1) checkDate = checkDate.split(dateFormatDelim[x]).join('DELIM');
	while(checkDate.indexOf('DELIMDELIM') > -1) checkDate = checkDate.split('DELIMDELIM').join('DELIM');
	checkDate = checkDate.split('DELIM');
	while(!checkDate[0] || checkDate[0] == '') checkDate.shift()
	while(!checkDate[checkDate.length - 1] || checkDate[checkDate.length - 1] == '') checkDate.pop();
	// compare string array to format array and set result['YYYY'], result['mm'] & result['dd']
	result = new Object();
	for(x = 0; x < checkFormat.length; x++) {
		switch(checkFormat[x]) {
			case 'monthShort':
				for(y = 0; y < months.length; y++) if(months[y].indexOf(checkDate[x]) == 0) result['mm'] = parseInt(y);
			break;
			case 'month':
				for(y = 0; y < months.length; y++) if(months[y] == checkDate[x]) result['mm'] = parseInt(y);
			break;
			case 'dd':
				result['dd'] = checkDate[x];
			break;
			case 'DD':
				result['dd'] = checkDate[x];
			break;
			case 'mm':
				result['mm'] = (checkDate[x] - 1);
			break;
			case 'MM':
				result['mm'] = (checkDate[x] - 1);
			break;
			case 'YYYY':
				result['YYYY'] = checkDate[x];
			break;
			case 'YY':
				temp = new Date(checkDate[x], 0, 1);
				result['YYYY'] = temp.getFullYear();
		}
	}
	// return new date
	resultDate = new Date(result['YYYY'], result['mm'], result['dd']);
	return resultDate;
}

// ------------- dateWriteString ------------- //
// function		: reads date String as specified by dateFormat
// returns		: string
function dateWriteString(myDate, myPreview) {
	if(myPreview) result = datePreviewFormat;
	else result = dateFormat;
	mySplit = 'dayShort';
	myJoin = days[myDate.getDay()].substring(0, 3);
	result = result.split(mySplit).join(myJoin);
	mySplit = 'day';
	myJoin = days[myDate.getDay()];
	result = result.split(mySplit).join(myJoin);
	mySplit = 'monthShort';
	myJoin = months[myDate.getMonth()].substring(0, 3);
	result = result.split(mySplit).join(myJoin);
	mySplit = 'month';
	myJoin = months[myDate.getMonth()];
	result = result.split(mySplit).join(myJoin);
	mySplit = 'dd';
	myJoin = myDate.getDate();
	result = result.split(mySplit).join(myJoin);
	mySplit = 'DD';
	if(myJoin < 10) myJoin = '0' + myJoin;
	result = result.split(mySplit).join(myJoin);
	mySplit = 'mm';
	myJoin = (myDate.getMonth() + 1);
	result = result.split(mySplit).join(myJoin);
	mySplit = 'MM';
	if(myJoin < 10) myJoin = '0' + myJoin;
	result = result.split(mySplit).join(myJoin);
	mySplit = 'YYYY';
	myJoin = myDate.getFullYear();
	result = result.split(mySplit).join(myJoin);
	mySplit = 'YY';
	myJoin = myJoin % 100;
	if(myJoin < 10) myJoin = '0' + myJoin;
	result = result.split(mySplit).join(myJoin);
	return result;
}



//-----------------------------------------------------------------------------------------------------------------------------
//-----------------------------------------------------------------------------------------------------------------------------
//					color picker functions & variables
//-----------------------------------------------------------------------------------------------------------------------------
//-----------------------------------------------------------------------------------------------------------------------------


//-----------------------------------------------------------------------------------------------------------------------------
//					public
//-----------------------------------------------------------------------------------------------------------------------------

// ------------- variables ------------- //
// width & height of color in palette (in pixels)
var colorTdWidth = 8;
var colorTdHeight = 8;
// number of steps between each base color
var colorBaseSteps = 6;
// number of steps between color & white or black
var colorSubSteps = 15;
// number of columns in library
var colorLibCols = 1;

// ------------- colorSubmit ------------- //
// function		: submit selected color
function colorSubmit() {
	// do someting ...
	// set selected color as value of active form field
	colorField.value = colorSelected;
	colorField.style.backgroundColor = colorSelected;
	colorField.style.color = compColor(colorSelected);
	// hide color picker
	colorShowDiv(false);
	
	// private
	triggerEvent('change', colorField);
	triggerEvent('blur', colorField);
}

// ------------- colorSetFavourite ------------- //
// function		: add selected color to favourites
function colorSetFavorite(myBool) {
	if(myBool) {
		done = false;
		// prompt for name
		if(result = window.prompt('choose a name')) {
			// check for duplicate entries
			if(colorPersCols[result]) {
				if(window.confirm('You will overwrite \'' + result + '\'.\nAre you sure?')) {
					// set color as entry in favorites array
					colorPersCols[result] = colorSelected;
					done = true;
				}
			}
			// check if entry contains brackets or quotes
			else {
				forbidden = new Array('\'', '\"', '[', ']');
				// set color as entry in favorites array
				if(!stringContains(result, forbidden)) {
					colorPersCols[result] = colorSelected;
					done = true;
				}
				else {
					window.alert('Do not use any brackets or quotes!');
					colorSetFavorite(true);
				}
			}
		}
	}
	// alert for removal
	else if(arrayContains(colorPersCols, colorSelected)) {
		if(window.confirm('Are you sure?')) {
			// remove color from favorites array
			colorPersCols = objectRemoveValue(colorPersCols, colorSelected);
			done = true;
		}
	}
	// alert no color selected
	else window.alert('Select a color first.');
	// show favorites
	if(done) {
		// do something ...
		// e.g. store favourites in a cookie
		myStr = object2string(colorPersCols, '__', '_--_');
		createCookie('FATfavouriteColours', myStr, 36500);
		// end of do something ...
		// leave unchanged
		colorActiveLib = 'fav';
		document.getElementById('bColorLib').options[0].selected = 'selected';
		colorMakeLib();
	}
}

// ------------- colorGetFavourite ------------- //
// function		: add selected color to favourites
// returns		: array of colors (myArray['myName'] = 'myColor')
function colorGetFavorite() {
	// do something ...
	// e.g. read favourites from a cookie
	myStr = readCookie('FATfavouriteColours');
	if(myStr) colorPersCols = string2object(myStr, '__', '_--_');
	// end of do something ...
	// leave unchanged
	return objectSortKey(colorPersCols);
}


//-----------------------------------------------------------------------------------------------------------------------------
//					private
//-----------------------------------------------------------------------------------------------------------------------------

// ------------- variables ------------- //
// current color
var colorSelected = '';
// current form field
var colorField;
// form color fields
var colorFields = new Object();
// current palette ('pal' for palette, 'lib' for library)
var colorActivePal = 'pal';
// current library
var colorActiveLib = '';
// palette innerHTML
var colorPalDivString = '';
// favorite colors
var colorPersCols = new Object();

// ------------- initColor ------------- //
function initColor() {
	// write palette, color & black & white slides
	colorMakePal();
	colorMakeSlide('AAAAAA');
	colorMakeBw();
	// set style of form color fields
	for(x in colorFields) {
		if(colorFields[x].value != '') {
			colorFields[x].style.backgroundColor = colorFields[x].value;
			colorFields[x].style.color = compColor(colorFields[x].value);
		}
	}
}

// ------------- colorShowDiv ------------- //
function colorShowDiv(myBool, myZ, myLeft, myTop, myField, myLabel) {
	if(myBool) {
		document.getElementById('dColorPicker').style.visibility = 'visible';
		document.getElementById('dColorPicker').style.display = 'block';
		document.getElementById('dColorPicker').style.zIndex = myZ;
		document.getElementById('dColorPicker').style.left = myLeft + 'px';
		document.getElementById('dColorPicker').style.top = myTop + 'px';
		document.getElementById('dColorLabel').innerHTML = myLabel;
		colorField = myField;
		myColor = myField.value;
		if(myColor != '') {
			document.getElementById('dColorLastPrev').style.visibility = 'visible';
			document.getElementById('dColorLastPrev').style.display = 'block';
			document.getElementById('dColorLastPrev').style.backgroundColor = myColor;
			document.getElementById('dColorLastPrev').style.color = compColor(myColor);
			document.getElementById('dColorLastPrev').innerHTML = 'previous';
			if(colorSelected == '') colorSet(myColor);
		}
		else {
			document.getElementById('dColorLastPrev').style.visibility = 'hidden';
			document.getElementById('dColorLastPrev').style.display = 'none';
			if(colorSelected == '') colorSet('#FFFFFF');
		}
	}
	else {
		document.getElementById('dColorPicker').style.visibility = 'hidden';
		document.getElementById('dColorPicker').style.display = 'none';
	}
}

// ------------- colorPreview ------------- //
function colorPreview(myColor) {
	document.getElementById('dColorPrev').style.backgroundColor = myColor;
	document.getElementById('dColorPrev').style.color = compColor(myColor);
	document.getElementById('dColorPrev').innerHTML = myColor;
}

// ------------- colorSet ------------- //
function colorSet(myColor) {
	colorSelected = myColor;
	document.getElementById('dColorSelect').style.backgroundColor = myColor;
	document.getElementById('dColorSelect').style.color = compColor(myColor);
	colorSelected = myColor;
}

// ------------- colorSwitch ------------- //
function colorSwitch() {
	if(colorActivePal == 'pal') colorMakeLib();
	else colorMakePal();
}

// ------------- colorGetUsed ------------- //
function colorGetUsed() {
	result = new Object();
	for(x in colorFields) if(colorFields[x].value != '') result[x] = colorFields[x].value;
	return result;
}

// ------------- colorMakePal ------------- //
function colorMakePal() {
	document.getElementById('dColorPal').style.width = 6 * colorBaseSteps * colorTdWidth + 'px';
	document.getElementById('dColorPal').style.height = (colorSubSteps + 1) * colorTdHeight + 'px';
	document.getElementById('dColorPal').style.overflow = 'visible';
	document.getElementById('dColorPal').className = 'colorPal';
	document.getElementById('bColorSwitch').value = 'colour libraries';
	document.getElementById('bColorLib').style.visibility = 'hidden';
	document.getElementById('bColorLib').style.display = 'none';
	document.getElementById('bColorRemove').style.visibility = 'hidden';
	document.getElementById('bColorRemove').style.display = 'none';
	colorActivePal = 'pal';
	if(colorPalDivString == '') {
		baseColors = new Object();
		baseColors['R'] = new Array();
		baseColors['G'] = new Array();
		baseColors['B'] = new Array();
		subColors = new Object();
		subColors['R'] = new Array();
		subColors['G'] = new Array();
		subColors['B'] = new Array();
		colMax = 255;
		colDif = Math.floor(colMax / colorBaseSteps);
		R = colMax;
		G = 0;
		B = 0;
		for(i = 0; i < colorBaseSteps; i++) {
			baseColors['R'].push(R);
			baseColors['G'].push(parseInt(G + (i * colDif)));
			baseColors['B'].push(B);
		}
		G = colMax;
		for(i = 0; i < colorBaseSteps; i++) {
			baseColors['R'].push(parseInt(R - (i * colDif)));
			baseColors['G'].push(G);
			baseColors['B'].push(B);
		}
		R = 0;
		for(i = 0; i < colorBaseSteps; i++) {
			baseColors['R'].push(R);
			baseColors['G'].push(G);
			baseColors['B'].push(parseInt(B + (i * colDif)));
		}
		B = colMax;
		for(i = 0; i < colorBaseSteps; i++) {
			baseColors['R'].push(R);
			baseColors['G'].push(parseInt(G - (i * colDif)));
			baseColors['B'].push(B);
		}
		G = 0;
		for(i = 0; i < colorBaseSteps; i++) {
			baseColors['R'].push(parseInt(R + (i * colDif)));
			baseColors['G'].push(G);
			baseColors['B'].push(B);
		}
		R = colMax;
		for(i = 0; i < colorBaseSteps; i++) {
			baseColors['R'].push(R);
			baseColors['G'].push(G);
			baseColors['B'].push(parseInt(B - (i * colDif)));
		}
		B = 0;
		for(i = 0; i < baseColors['R'].length; i++) {
			subColors['R'][i] = new Array();
			subColors['G'][i] = new Array();
			subColors['B'][i] = new Array();
			RDif = Math.floor(baseColors['R'][i] / colorSubSteps);
			GDif = Math.floor(baseColors['G'][i] / colorSubSteps);
			BDif = Math.floor(baseColors['B'][i] / colorSubSteps);
			for(j = 1; j <= colorSubSteps; j++) {
				subColors['R'][i].push(baseColors['R'][i] - (j * RDif));
				subColors['G'][i].push(baseColors['G'][i] - (j * GDif));
				subColors['B'][i].push(baseColors['B'][i] - (j * BDif));
			}
		}
		colorPalDivString = '<table cellspacing="0" cellpadding="0">';
		colorPalDivString += '<tr>';
		for(i = 0; i < baseColors['R'].length; i++) {
			myColor = dec2hex(baseColors['R'][i]) + dec2hex(baseColors['G'][i]) + dec2hex(baseColors['B'][i]);
			colorPalDivString += '<td width="' + colorTdWidth + '" height="' + colorTdHeight + '" bgcolor="#' + myColor + '" onMouseOver="colorPreview(\'#' + myColor + '\');" onClick="colorMakeSlide(\'#' + myColor + '\'); colorSet(\'#' + myColor + '\');">';
			if(navIsSafari) colorPalDivString += '<div style="width: ' + colorTdWidth + 'px; height: ' + colorTdHeight + 'px; background-color: #' + myColor + ';" onMouseOver="colorPreview(\'#' + myColor + '\');" onClick="colorMakeSlide(\'#' + myColor + '\'); colorSet(\'#' + myColor + '\');"></div>';
			colorPalDivString += '</td>';
		}
		colorPalDivString += '</tr>';
		for(i = 0; i < subColors['R'][0].length; i++) {
			colorPalDivString += '<tr>';
			for(j = 0; j < baseColors['R'].length; j++) {
				myColor = dec2hex(subColors['R'][j][i]) + dec2hex(subColors['G'][j][i]) + dec2hex(subColors['B'][j][i]);
				colorPalDivString += '<td width="' + colorTdWidth + '" height="' + colorTdHeight + '" bgcolor="#' + myColor + '" onMouseOver="colorPreview(\'#' + myColor + '\');" onClick="colorMakeSlide(\'#' + myColor + '\'); colorSet(\'#' + myColor + '\');">';
				if(navIsSafari) colorPalDivString += '<div style="width: ' + colorTdWidth + 'px; height: ' + colorTdHeight + 'px; background-color: #' + myColor + ';" onMouseOver="colorPreview(\'#' + myColor + '\');" onClick="colorMakeSlide(\'#' + myColor + '\'); colorSet(\'#' + myColor + '\');"></div>';
				colorPalDivString += '</td>';
			}
			colorPalDivString += '</tr>';
		}
		colorPalDivString += '</table>';
	}
	document.getElementById('dColorPal').innerHTML = colorPalDivString;
}

// ------------- colorMakeLib ------------- //
function colorMakeLib() {
	document.getElementById('dColorPal').style.width = 6 * colorBaseSteps * colorTdWidth + 'px';
	//document.getElementById('dColorPal').style.height = 2 * (colorSubSteps + 1) * colorTdHeight + 'px';
	document.getElementById('dColorPal').style.height = (colorSubSteps + 1) * colorTdHeight + 'px';
	document.getElementById('dColorPal').style.overflow = 'auto';
	document.getElementById('dColorPal').className = 'colorLib';
	document.getElementById('bColorSwitch').value = 'colour picker';
	document.getElementById('bColorLib').style.visibility = 'visible';
	document.getElementById('bColorLib').style.display = 'inline';
	colorActivePal = 'lib';
	if(colorActiveLib == '') colorActiveLib = 'simple';
	if(colorActiveLib == 'fav') {
		document.getElementById('bColorRemove').style.visibility = 'visible';
		document.getElementById('bColorRemove').style.display = 'inline';
	}
	else {
		document.getElementById('bColorRemove').style.visibility = 'hidden';
		document.getElementById('bColorRemove').style.display = 'none';
	}
	switch(colorActiveLib) {
		case 'simple': colors = namedSimpleColors;
		break;
		case 'used': colors = colorGetUsed();
		break;
		case 'fav': colors = colorGetFavorite();
		break;
		case 'w3c': colors = namedColors;
		break;
		case 'pantone': colors = pantoneColors;
	}
	divString = '<table>';
	j = 0;
	for(i in colors) {
		j++;
		if(j == 1) divString += '<tr>';
		//divString += '<td><div class="colorLibItem"  style="background-color: ' + colors[i] + '; color: ' + compColor(colors[i]) + ';" onMouseOver="colorPreview(\'' + colors[i] + '\');" onClick="colorMakeSlide(\'' + colors[i] + '\'); colorSet(\'' + colors[i] + '\');">' + i + '<br />' + colors[i] + '</div></td>';
		divString += '<td><div class="colorLibItem"  style="background-color: ' + colors[i] + '; color: ' + compColor(colors[i]) + ';" onMouseOver="colorPreview(\'' + colors[i] + '\');" onClick="colorMakeSlide(\'' + colors[i] + '\'); colorSet(\'' + colors[i] + '\');">' + i + '</div></td>';
		if(j == colorLibCols) {
			divString += '</tr>';
			j = 0;
		}
		if(i == (colors.lentgh - 1) && j > 0) divString += '<td colspan="' + (colorLibCols - j) + '"></td></tr>';
	}
	divString += '</table>';
	document.getElementById('dColorPal').innerHTML = divString;
}

// ------------- colorMakeSlide ------------- //
function colorMakeSlide(col) {
	if(col.indexOf('#') > -1) col = col.split('#').join('');
	R = hex2dec(col.substring(0, 2));
	G = hex2dec(col.substring(2, 4));
	B = hex2dec(col.substring(4, 6));
	colors = new Array();
	colors['R'] = new Array();
	colors['G'] = new Array();
	colors['B'] = new Array();
	RDif = Math.floor((colMax - R) / colorSubSteps);
	GDif = Math.floor((colMax - G) / colorSubSteps);
	BDif = Math.floor((colMax - B) / colorSubSteps);
	for(i = 0; i < colorSubSteps; i++) {
		colors['R'].push(R + (i * RDif));
		colors['G'].push(G + (i * GDif));
		colors['B'].push(B + (i * BDif));
	}
	colors['R'].push(255);
	colors['G'].push(255);
	colors['B'].push(255);
	divString = '<table cellspacing="0" cellpadding="0" width="100%">';
	for(i = 0; i < colors['R'].length; i++) {
		myColor = dec2hex(colors['R'][i]) + dec2hex(colors['G'][i]) + dec2hex(colors['B'][i]);
		divString += '<tr>';
		divString += '<td width="100%" height="' + colorTdHeight + '" bgcolor="#' + myColor + '" onMouseOver="colorPreview(\'#' + myColor + '\');" onClick=" colorSet(\'#' + myColor + '\');">';
		if(navIsSafari) divString += '<div style="width: 100%; height: ' + colorTdHeight + 'px; background-color: #' + myColor + ';" onMouseOver="colorPreview(\'#' + myColor + '\');" onClick="colorSet(\'#' + myColor + '\');"></div>';
		divString += '</td>';
		divString += '</tr>';
	}
	divString += '</table>';
	document.getElementById('dColorSlide').innerHTML = divString;
	colors = new Array();
	colors['R'] = new Array();
	colors['G'] = new Array();
	colors['B'] = new Array();
	RDif = Math.floor(R / colorSubSteps);
	GDif = Math.floor(G / colorSubSteps);
	BDif = Math.floor(B / colorSubSteps);
	for(i = 0; i < colorSubSteps; i++) {
		colors['R'].push(R - (i * RDif));
		colors['G'].push(G - (i * GDif));
		colors['B'].push(B - (i * BDif));
	}
	colors['R'].push(0);
	colors['G'].push(0);
	colors['B'].push(0);
	colors['R'] = colors['R'].reverse();
	colors['G'] = colors['G'].reverse();
	colors['B'] = colors['B'].reverse();
	divString = '<table cellspacing="0" cellpadding="0" width="100%">';
	for(i = 0; i < colors['R'].length; i++) {
		myColor = dec2hex(colors['R'][i]) + dec2hex(colors['G'][i]) + dec2hex(colors['B'][i]);
		divString += '<tr>';
		divString += '<td width="100%" height="' + colorTdHeight + '" bgcolor="#' + myColor + '" onMouseOver="colorPreview(\'#' + myColor + '\');" onClick=" colorSet(\'#' + myColor + '\');">';
		if(navIsSafari) divString += '<div style="width: 100%; height: ' + colorTdHeight + 'px; background-color: #' + myColor + ';" onMouseOver="colorPreview(\'#' + myColor + '\');" onClick="colorSet(\'#' + myColor + '\');"></div>';
		divString += '</td>';
		divString += '</tr>';
	}
	divString += '</table>';
	document.getElementById('dColorRevSlide').innerHTML = divString;
}

// ------------- colorMakeBw ------------- //
function colorMakeBw() {
	R = 0;
	G = 0;
	B = 0;
	colors = new Array();
	dif = Math.floor(colMax / colorSubSteps);
	for(i = 0; i < colorSubSteps; i++) colors.push(i * dif);
	divString = '<table cellspacing="0" cellpadding="0" width="100%">';
	for(i = 0; i < colors.length; i++) {
		myColor = dec2hex(colors[i]) + dec2hex(colors[i]) + dec2hex(colors[i]);
		divString += '<tr>';
		divString += '<td width="100%" height="' + colorTdHeight + '" bgcolor="#' + myColor + '" onMouseOver="colorPreview(\'#' + myColor + '\');" onClick=" colorSet(\'#' + myColor + '\');">';
		if(navIsSafari) divString += '<div style="width: 100%; height: ' + colorTdHeight + 'px; background-color: #' + myColor + ';" onMouseOver="colorPreview(\'#' + myColor + '\');" onClick="colorSet(\'#' + myColor + '\');"></div>';
		divString += '</td>';
		divString += '</tr>';
	}
	myColor = 'FFFFFF';
	divString += '<tr>';
	divString += '<td width="100%" height="' + colorTdHeight + '" bgcolor="#' + myColor + '" onMouseOver="colorPreview(\'#' + myColor + '\');" onClick=" colorSet(\'#' + myColor + '\');">';
	if(navIsSafari) divString += '<div style="width: 100%; height: ' + colorTdHeight + 'px; background-color: #' + myColor + ';" onMouseOver="colorPreview(\'#' + myColor + '\');" onClick="colorSet(\'#' + myColor + '\');"></div>';
	divString += '</td>';
	divString += '</tr>';
	divString += '</table>';
	document.getElementById('dColorBW').innerHTML = divString;
}