/******************************** Events **************************************/
function addEvent(obj, evType, fn, useCapture) {
    if (obj.addEventListener){
        obj.addEventListener(evType, fn, useCapture);
        return true;
    }
    else if (obj.attachEvent){
        var r = obj.attachEvent("on"+evType, fn);
        return r;
    }
    else {
        alert("Handler could not be attached");
    }
} //end addEvent(obj, evType, fn, useCapture)

function compareNum(a,b) {
	return a-b;
}

var empty = new Image();
empty.src = "images/dot-empty.gif";

var filled = new Image();
filled.src = "images/dot-filled.gif";

function toggleElement(id, img) { //Show or hide an element
    var element = document.getElementById(id);
    var image = document.getElementById(img);

    if (element.className=="hidden") {
	    element.className="";
	    if (image) { image.src='images/minus.gif'; }
    }

    else {
        element.className="hidden";
        if (image) { image.src='images/plus.gif'; }
    }
} //end toggleElement(id, img)

function bubble_clicked(bubbleName) {
    bubble_basename = bubbleName.substring(0, bubbleName.lastIndexOf('_'));
	bubble_count = bubbleName.substring(bubbleName.lastIndexOf('_') + 1, bubbleName.length);
	thisBubble = document.getElementById(bubbleName);
	selectionBox = document.getElementById(bubble_basename);
	changed = false;

	if (thisBubble != null) {
		nextBubble = document.getElementById(bubble_basename+'_'+(bubble_count*1+1));
		prevBubble = document.getElementById(bubble_basename+'_'+(bubble_count*1-1));

		if (nextBubble != null) {
			if (thisBubble.src != nextBubble.src) {
				change_image(bubbleName, 'empty');
				selectionBox.selectedIndex = bubble_count - 1;
				changed = true;
			}
		}
		else if (thisBubble.src == prevBubble.src && thisBubble.src == filled.src) {
			change_image(bubbleName, 'empty');
			selectionBox.selectedIndex = bubble_count - 1;
			changed = true;
		}
	}

	if (!changed) {
		selectionBox.selectedIndex = bubble_count;
		for (count = 1; count <= 10; count++) {
			if (count <= bubble_count) {
				change_image(bubble_basename + '_' + count, 'filled');
			}
			else {
				change_image(bubble_basename + '_' + count, 'empty');
			}
		}
	}
} //end bubble_clicked(bubbleName)

function change_image(picName, imgName) {
   if (document.images) {
      imgOn=eval(imgName + ".src");
	  theElement = document.getElementById(picName);

	  if (theElement != null && theElement.src != imgOn) {
	  	theElement.src = imgOn;
	  }
   }
} //end change_image(picName, imgName)

/***************************** Dynamic Listboxes ******************************/
function dynamicSelect(id1, id2) {
    if (document.getElementById && document.getElementsByTagName) {
		var sel1 = document.getElementById(id1);
		var sel2 = document.getElementById(id2);

		var selected = sel2.selectedIndex;
		var initialValue = sel2.options[sel2.selectedIndex].value;

		if (!sel1 || !sel2) {
			return;
		}

		var clone = sel2.cloneNode(true);
		var clonedOptions = clone.getElementsByTagName("option");
		refreshDynamicSelectOptions(sel1, sel2, clonedOptions);

		addEvent(sel1, "change", function() {
			if (id1 == 'exalt_type' ) {
				//document.body.className = sel1.options[sel1.selectedIndex].value;
				switch (sel1.options[sel1.selectedIndex].value) {
					case 'Solar':
					    showExaltBoxes(true, 'solar');
                                            solarAbilities();
                        break;
                    case 'Infernal':
					    showExaltBoxes(true, 'infernal');
                                            infernalAbilities();
                        break;
                    case 'Abyssal':
					    showExaltBoxes(true, 'abyssal');
                                            abyssalAbilities();
                        break;
                    case 'Sidereal':
					    showExaltBoxes(true, 'sidereal');
                                            siderealAbilities();
                        break;
                    case 'Lunar':
					    showExaltBoxes(true, 'lunar');
                                            lunarAbilities();
                        break;
                    case 'Dragon-Blooded':
					    showExaltBoxes(true, 'dragon-blooded');
                                            dbAbilities();
                        break;

                    case 'Raksha':
					    showExaltBoxes(false, 'raksha');
                                            rakshaAbilities();
                        break;

                    case 'Dragon-King':
					    showExaltBoxes(false, 'dragon-king');
                                            lunarAbilities();
                        break;
                    case 'Mountain Folk':
					    showExaltBoxes(false, 'mountain folk');
                                            lunarAbilities();
                        break;
                    case 'God-Blooded':
                                    showExaltBoxes(false, 'god-blooded');
                                            lunarAbilities();
                        break;
                    case 'Heroic Mortal':
                    case 'Beastman':
                    			    showExaltBoxes(false, 'mortal');
                                            lunarAbilities();
                        break;
                    case 'Heroic Ghost':
					    showExaltBoxes(false, 'ghost');
                                            lunarAbilities();
                        break;
				}

				updateEssencePools();
			}
            else if( id1 == 'exalt_subtype' ) {
                var exaltedSelect = document.getElementById('exalt_type');
                var exaltedType = exaltedSelect.options[exaltedSelect.selectedIndex].value;

                if( exaltedType == 'God-Blooded' ) {
                    showExaltBoxes(false, 'god-blooded');
                                            lunarAbilities();
                }
                updateEssencePools();
            }
            refreshDynamicSelectOptions(sel1, sel2, clonedOptions);
        }, false);

		// set back to orginal selected value
		if (id2 == 'exalt_subtype') {
			sel2.selectedIndex = getListIndex(sel2, initialValue);
		}
		else {
			sel2.selectedIndex = selected;
		}
    }
} //End dynamicSelect(id1, id2)

function getListIndex(list, value) {
    for (var i = 0; i < list.length; i++) {
		if (list.options[i].value == value) return i;
    }
	return -1;
} //end getListIndex(list, value)

function refreshDynamicSelectOptions(sel1, sel2, clonedOptions) {
	selected = sel2.selectedIndex;
    while (sel2.options.length) {
        sel2.remove(0);
    }

    var pattern1 = /( |^)(select)( |$)/;
    var pattern2 = new RegExp("( |^)(" +
          sel1.options[sel1.selectedIndex].value + ")( |$)");

    for (var i = 0; i < clonedOptions.length; i++) {
        if (clonedOptions[i].className.match(pattern1) ||
              clonedOptions[i].className.match(pattern2) ||
			  clonedOptions[i].className == '') { //end of long if
            sel2.appendChild(clonedOptions[i].cloneNode(true));
        }
    }
    return selected;
} //end refreshDynamicSelectOptions(sel1, sel2, clonedOptions)

function showExaltBoxes( yes, type ) {
    var node = new Array();
    node[0] = document.getElementById("exalts_only");
    node[1] = document.getElementById("lunars_only");
    node[2] = document.getElementById("enlightened_essence_span");
    node[3] = document.getElementById("ghosts_only");
    node[4] = document.getElementById("intimacies");
    node[5] = document.getElementById("graces");
    node[6] = new Array();
    node[6][0] = document.getElementById("attributes[physical][strength][1]");
node[6][1] = document.getElementById("attributes[physical][dexterity][1]");
node[6][2] = document.getElementById("attributes[physical][stamina][1]");
node[6][3] = document.getElementById("attributes[social][charisma][1]");
node[6][4] = document.getElementById("attributes[social][manipulation][1]");
node[6][5] = document.getElementById("attributes[social][appearance][1]");
node[6][6] = document.getElementById("attributes[mental][perception][1]");
node[6][7] = document.getElementById("attributes[mental][intelligence][1]");
node[6][8] = document.getElementById("attributes[mental][wits][1]");
    node[7] = document.getElementById("colleges");
    node[8] = document.getElementById( "fae_only" );
    node[9] = document.getElementById( "profession_div" );
    node[10] = document.getElementById( "parent_div" );
    node[11] = document.getElementById( "urge_div" );
    node[12] = document.getElementById( "second_caste_div" );
    node[13] = document.getElementById("combos_div");
    node[14] = document.getElementById("shapes_div");
    node[15] = document.getElementById("knacks_div");
    //node[6] = document.getElementById("dbt_div");

    node[1].className = "hidden"; //lunar
    node[2].className = "hidden"; //mortal
    node[3].className = "hidden" //ghost
    node[4].className = ""; //not ghosts
    node[5].className = "hidden"; //raksha
    for( var i= 0; i<9; i++ ) {
                node[6][i].className = "hidden";
            }

    node[7].className = "hidden"; //Sidereal
    node[8].className = "hidden"; //Raksha
    node[9].className = "hidden"; //Mortal
    node[10].className = "hidden"; //God-blooded
    node[11].className = "hidden"; //Infernal
    node[12].className = "hidden"; //Raksha
    node[14].className = "hidden"; //Lunar
    node[15].className = "hidden"; //Lunar

    if(yes) {
        node[0].className = "";
    }
    else {
        node[0].className = "hidden";
    }
    
    switch(type) {
        case 'mountain folk':
            node[2].className = ""; //mortal
        break;

        case 'dragon-king':
            
        break;

        case 'mortal':
            node[2].className = ""; //mortal
            node[9].className = ""; //Mortal
        break;

        case 'ghost':
            node[1].className = "hidden"; //lunar
            node[3].className = ""; //ghost
        break;

        case 'lunar':
            node[1].className = ""; //lunar
            for( var i= 0; i<9; i++ ) {
                node[6][i].className = "";
            }
            node[14].className = ""; //Lunar
            node[15].className = ""; //Lunar
        break;
        
        case 'raksha':
            node[5].className = ""; //raksha
            node[8].className = ""; //Raksha
            node[12].className = ""; //Raksha
        break;
        
        case 'sidereal':
            node[7].className = ""; //Sidereal
        break;

        case 'infernal':
            node[11].className = ""; //Infernal
        break;

        case 'solar':
        case 'abyssal':
        case 'dragon-blooded':

        break;
        
        case 'god-blooded':
            node[10].className = ""; //God-blooded
        break;
    }
} //end showExaltBoxes( yes, type )

/****************************** Abilities *************************************/
function solarAbilities() {
    setupGroup('Dawn', 'abilities1');
    setupGroup('Zenith', 'abilities2');
    setupGroup('Twilight', 'abilities3');
    setupGroup('Night', 'abilities4');
    setupGroup('Eclipse', 'abilities5');
} //end solarAbilities()

function abyssalAbilities() {
    setupGroup('Dusk', 'abilities1');
    setupGroup('Midnight', 'abilities2');
    setupGroup('Daybreak', 'abilities3');
    setupGroup('Day', 'abilities4');
    setupGroup('Moonshadow', 'abilities5');
} //end abyssalAbilities()

function siderealAbilities() {
    setupGroup('Journeys', 'abilities1');
    setupGroup('Serenity', 'abilities2');
    setupGroup('Battles', 'abilities3');
    setupGroup('Secrets', 'abilities4');
    setupGroup('Endings', 'abilities5');
} //end siderealAbilities()

function dbAbilities() {
    setupGroup('Air', 'abilities1');
    setupGroup('Earth', 'abilities2');
    setupGroup('Fire', 'abilities3');
    setupGroup('Water', 'abilities4');
    setupGroup('Wood', 'abilities5');
} //end dbAbilities()

function rakshaAbilities() {
    setupGroup('Diplomat', 'abilities1');
    setupGroup('Entertainer', 'abilities2');
    setupGroup('Warrior', 'abilities3');
    setupGroup('Worker', 'abilities4');
    setupGroup('Casteless', 'abilities5');
} //end rakshaAbilities()

function lunarAbilities() {
    setupGroup('War', 'abilities1');
    setupGroup('Life', 'abilities2');
    setupGroup('Wisdom', 'abilities3');
    setupGroup('', 'abilities4');
    setupGroup('', 'abilities5');
} //end lunarAbilities()

function infernalAbilities() {
    setupGroup('Slayer', 'abilities1');
    setupGroup('Malefactor', 'abilities2');
    setupGroup('Defiler', 'abilities3');
    setupGroup('Scourge', 'abilities4');
    setupGroup('Fiend', 'abilities5');
} //end infernalAbilities()

function setupGroup(group, element) {
    var nodes = document.getElementById(element).childNodes;

    while(nodes[3].hasChildNodes() == true) {
        nodes[3].removeChild(nodes[3].childNodes[0]);
    }
    nodes[1].innerHTML = group;

    switch (group) {
            //Solar/Abyssal/Infernal abilities
            case "Dawn":
            case "Dusk":
            case "Slayer":
                setupAbility('Archery', element);
                setupAbility('Martial Arts', element);
                setupAbility('Melee', element );
                setupAbility('Thrown', element );
                setupAbility('War', element );
            break;

            case "Zenith":
            case "Midnight":
            case "Malefactor":
                setupAbility('Integrity', element );
                setupAbility('Performance', element );
                setupAbility('Presence', element );
                setupAbility('Resistance', element );
                setupAbility('Survival', element );
            break;

            case "Twilight":
            case "Daybreak":
            case "Defiler":
                setupAbility('Craft', element );
                setupAbility('Investigation', element );
                setupAbility('Lore', element );
                setupAbility('Medicine', element );
                setupAbility('Occult', element );
            break;

            case "Night":
            case "Day":
            case "Scourge":
                setupAbility('Athletics', element );
                setupAbility('Awareness', element );
                setupAbility('Dodge', element );
                setupAbility('Larceny', element );
                setupAbility('Stealth', element );
            break;

            case "Eclipse":
            case "Moonshadow":
            case "Fiend":
                setupAbility('Bureaucracy', element );
                setupAbility('Linguistics', element );
                setupAbility('Ride', element );
                setupAbility('Sail', element );
                setupAbility('Socialize', element );
            break;

            //Sidereal
            case "Journeys":
                setupAbility('Resistance', element );
                setupAbility('Ride', element );
                setupAbility('Sail', element );
                setupAbility('Survival', element );
                setupAbility('Thrown', element );
            break;

            case "Serenity":
                setupAbility('Craft', element );
                setupAbility('Dodge', element );
                setupAbility('Linguistics', element );
                setupAbility('Performance', element );
                setupAbility('Socialize', element );
            break;

            case "Battles":
                setupAbility('Archery', element );
                setupAbility('Athletics', element );
                setupAbility('Melee', element );
                setupAbility('Presence', element );
                setupAbility('War', element );
            break;

            case "Secrets":
                setupAbility('Investigation', element );
                setupAbility('Larceny', element );
                setupAbility('Lore', element );
                setupAbility('Occult', element );
                setupAbility('Stealth', element );
            break;

            case "Endings":
                setupAbility('Awareness', element );
                setupAbility('Bureaucracy', element );
                setupAbility('Integrity', element );
                setupAbility('Martial Arts', element );
                setupAbility('Medicine', element );
            break;

            //Dragon-Blooded
            case "Air":
                setupAbility('Linguistics', element );
                setupAbility('Lore', element );
                setupAbility('Occult', element );
                setupAbility('Stealth', element );
                setupAbility('Thrown', element );
            break;

            case "Earth":
                setupAbility('Awareness', element );
                setupAbility('Craft', element );
                setupAbility('Integrity', element );
                setupAbility('Resistance', element );
                setupAbility('War', element );
            break;

            case "Fire":
                setupAbility('Athletics', element );
                setupAbility('Dodge', element );
                setupAbility('Melee', element );
                setupAbility('Presence', element );
                setupAbility('Socialize', element );
            break;

            case "Water":
                setupAbility('Bureaucracy', element );
                setupAbility('Investigation', element );
                setupAbility('Larceny', element );
                setupAbility('Martial Arts', element );
                setupAbility('Sail', element );
            break;

            case "Wood":
                setupAbility('Archery', element );
                setupAbility('Medicine', element );
                setupAbility('Performance', element );
                setupAbility('Ride', element );
                setupAbility('Survival', element );
            break;

            //Raksha
            case "Diplomat":
                setupAbility('Linguistics', element );
                setupAbility('Occult', element );
                setupAbility('Ride', element );
                setupAbility('Socialize', element );
                setupAbility('Thrown', element );
            break;
          
            case "Entertainer":
                setupAbility('Investigation', element );
                setupAbility('Larceny', element );
                setupAbility('Medicine', element );
                setupAbility('Performance', element );
                setupAbility('Stealth', element );
            break;

            case "Warrior":
                setupAbility('Archery', element );
                setupAbility('Martial Arts', element );
                setupAbility('Melee', element );
                setupAbility('Presence', element );
                setupAbility('War', element );
            break;

            case "Worker":
                setupAbility('Bureaucracy', element );
                setupAbility('Craft', element );
                setupAbility('Integrity', element );
                setupAbility('Lore', element );
                setupAbility('Resistance', element );
            break;

            case "Casteless":
                setupAbility('Athletics', element );
                setupAbility('Awareness', element );
                setupAbility('Dodge', element );
                setupAbility('Sail', element );
                setupAbility('Survival', element );
            break;
            
            //Lunars and default
            case "War":
                setupAbility('Archery', element );
                setupAbility('Athletics', element );
                setupAbility('Awareness', element );
                setupAbility('Dodge', element );
                setupAbility('Integrity', element );
                setupAbility('Martial Arts', element );
                setupAbility('Melee', element );
                setupAbility('Resistance', element );
                setupAbility('Thrown', element );
                setupAbility('War', element );
            break;

            case "Life":
                setupAbility('Craft', element );
                setupAbility('Larceny', element );
                setupAbility('Linguistics', element );
                setupAbility('Performance', element );
                setupAbility('Presence', element );
                setupAbility('Ride', element );
                setupAbility('Sail', element );
                setupAbility('Socialize', element );
                setupAbility('Stealth', element );
                setupAbility('Survival', element );
            break;

            case "Wisdom":
                setupAbility('Bureaucracy', element );
                setupAbility('Investigation', element );
                setupAbility('Lore', element );
                setupAbility('Medicine', element );
                setupAbility('Occult', element );
            break;

            default:
            break;
    }
} //end setupGroup(group, element)

function setupAbility(ability, element) {
    var type = document.getElementById('exalt_type').options[document.getElementById('exalt_type').selectedIndex].value;
    var maxValue = 5;
    if( type == "Mountain Folk" || type == "Raksha" || type == "Dragon-King") {
        maxValue = 7;
    }

    var nodes = document.getElementById(element).childNodes;
    
    if(ability != "Craft") {
        var lability = ability.toLowerCase();
        lability = lability.replace(/ /, '_');
        lability = "abilities[" + lability + "]";

        //The HTML-tags
        var theDivTag = document.createElement('div');
        theDivTag.setAttribute('id', lability + '_div');
        var theSpanTag = document.createElement('span');
        theSpanTag.setAttribute('id', lability + '_dots');
        var theImgTags = new Array();
        for (var i = 0; i < maxValue; i++) {
        	theImgTags[i] = document.createElement('img');
        	var id = lability + "[0]_" + (i+1);
        	theImgTags[i].setAttribute('src', 'images/dot-empty.gif');
        	theImgTags[i].setAttribute('id', id);
        	theImgTags[i].setAttribute('onclick', 'bubble_clicked(\'' + lability + '[0]_' + i + '\')');
        	theImgTags[i].setAttribute('alt', 'Dot');
        }
        var theSelectTag = document.createElement('select');
        theSelectTag.setAttribute('id', lability + '[0]');
        theSelectTag.setAttribute('name', lability + '[0]');
        theSelectTag.setAttribute('onchange', 'bubble_clicked(\'' + lability + '[0]_\'+this.options[selectedIndex].value)');
        var theOptionTags = new Array();
        for (i = 0; i <= maxValue; i++) {
        	theOptionTags[i] = document.createElement('option');
        	theOptionTags[i].setAttribute('value', i);
        	theOptionTags[i].appendChild(document.createTextNode(i));
        	if(i==0) {
        		theOptionTags[i].setAttribute('selected', 'selected');
        	}
        }
        var theInputTag = document.createElement('input');
        theInputTag.setAttribute('id', lability + '[1]');
        theInputTag.setAttribute('name', lability + '[1]');
        theInputTag.setAttribute('type', 'checkbox');
        theInputTag.setAttribute('title', 'Check this to make this favored');

        if(type == "Raksha") {
            var theInput2Tag = document.createElement('input');
            theInput2Tag.setAttribute('id', lability + '[2]');
            theInput2Tag.setAttribute('name', lability + '[2]');
            theInput2Tag.setAttribute('type', 'checkbox');
            theInput2Tag.setAttribute('title', 'Check this to make this favored');
        }

        //Text nodes
        var abilityName = document.createTextNode(ability + ' ');

        //Prepare the SelectTag
        for (i=0; i<= maxValue; i++) {
        	theSelectTag.appendChild(theOptionTags[i]);
        }

        //the span tag
        for (i=0; i< maxValue; i++) {
            if(i==5) {
                theSpanTag.appendChild(document.createTextNode(' '));
            }
        	theSpanTag.appendChild(theImgTags[i]);
        }
        theSpanTag.appendChild(theSelectTag);
        theSpanTag.appendChild(theInputTag);
        if( type == "Raksha" ) {
            theSpanTag.appendChild(theInput2Tag);
        }

        //the div tag
        theDivTag.appendChild(abilityName);
        theDivTag.appendChild(theSpanTag);
    }
    else {
        var theDivTag = document.createElement('div');
        theDivTag.setAttribute('id', 'core_craft_div');
        var theSpanTag = document.createElement('span');
        theSpanTag.setAttribute('id', 'craft_note');
        //Text nodes
        var abilityName = document.createTextNode('Craft ');
        var note = document.createTextNode('(see below)');

        //the span tag
        theSpanTag.appendChild(note);

        //the div tag
        theDivTag.appendChild(abilityName);
        theDivTag.appendChild(theSpanTag);
    }

    nodes[3].appendChild(theDivTag);
} //end setupAbility(ability, element)

function addLanguage() {
    var nodes = document.getElementById('languages').childNodes;

    var c = nodes[5].childNodes.length+1;


    var theDivTag = document.createElement('div');
        theDivTag.setAttribute('id', 'language_' + c + '_div');

    var theInputTag = document.createElement('input');
        theInputTag.type = "text";
        theInputTag.name = "languages[" + c + "]";
        theInputTag.id = theInputTag.name;

        theDivTag.appendChild(theInputTag);
    nodes[5].appendChild(theDivTag);
} //end addLanguage()


/******************************** Essence *************************************/

function updateEssencePools() {
	var essenceBox = document.getElementById('essence[value]');
	var essenceValue = essenceBox.options[essenceBox.selectedIndex].value;
	var personalTextBox = document.getElementById('essence[personal]');
	var peripheralTextBox = document.getElementById('essence[peripheral]');
	var exaltedSelect = document.getElementById('exalt_type');
	var exaltedType = exaltedSelect.options[exaltedSelect.selectedIndex].value;
    var subSelect = document.getElementById('exalt_subtype');
	var subType = subSelect.options[subSelect.selectedIndex].value;

	var wpValue = parseInt(document.getElementById('willpower').options[document.getElementById('willpower').selectedIndex].value);
	var enlightened = document.getElementById('essence[enlightened]').checked;
	
	var virtues = new Array(4);
	virtues[0] = parseInt(document.getElementById('virtues[compassion][value]').options[document.getElementById('virtues[compassion][value]').selectedIndex].value);
	virtues[1] = parseInt(document.getElementById('virtues[conviction][value]').options[document.getElementById('virtues[conviction][value]').selectedIndex].value);
	virtues[2] = parseInt(document.getElementById('virtues[temperance][value]').options[document.getElementById('virtues[temperance][value]').selectedIndex].value);
	virtues[3] = parseInt(document.getElementById('virtues[valor][value]').options[document.getElementById('virtues[valor][value]').selectedIndex].value);

	if (exaltedType == 'Heroic Mortal' || exaltedType == 'Beastman') {

	    if(enlightened) {
	        personalTextBox.value = 10 * essenceValue;
	    }
	    else {
		    personalTextBox.value = '0';
		}
		peripheralTextBox.value = '0';
	}
    else if( exaltedType == 'Heroic Ghost' ) {
        personalTextBox.value = 10 * essenceValue + 3* wpValue + 2*(virtues[0] + virtues[1] + virtues[2] + virtues[3]);
	    peripheralTextBox.value = '0';
    }

    else if( exaltedType == 'God-Blooded') {
        switch(subType) {
            case 'Raksha':
                personalTextBox.value = 8 * essenceValue;
            break;

            case 'Solar':
            case 'Lunar':
            case 'Abyssal':
            case 'Infernal':
            case 'Sidereal':
                personalTextBox.value = 4 * essenceValue + wpValue + virtues[0] + virtues[1] + virtues[2] + virtues[3];
            break;

            case 'Ghost':
            case 'Demon':
            case 'God':
            case 'Elemental':
                personalTextBox.value = 5 * essenceValue + 2* wpValue + virtues[0] + virtues[1] + virtues[2] + virtues[3];
            break;
        }
        peripheralTextBox.value = '0';
    }
	else if (exaltedType == 'Solar' || exaltedType == 'Abyssal' || exaltedType == 'Infernal') {
        personalTextBox.value = 3 * essenceValue + wpValue;
        peripheralTextBox.value = (7 * essenceValue) + wpValue + virtues[0] + virtues[1] + virtues[2] + virtues[3];
	}
	else if (exaltedType == 'Dragon-Blooded') {
		var highestBreeding = 0;
		for (i=0; i<10; i++) {
			background = document.getElementById('background_' + i);

			if (background != null) {
				theBackground = background.options[background.selectedIndex].value;
				if (theBackground == 'Breeding') {
					rating = parseInt(document.getElementById('background_rating_' + i).options[document.getElementById('background_rating_' + i).selectedIndex].value);
					if (rating > highestBreeding) {
						highestBreeding = rating;
					}
				}
			}
		}
		var breedingPersonal = highestBreeding * 1;
		var breedingPeripheral = highestBreeding * 2 - 1;
		if (highestBreeding == 1) {
			breedingPeripheral = 2;
		}
		virtues.sort(compareNum);
		personalTextBox.value = essenceValue * 1 + 1 * parseInt(wpValue) + parseInt(breedingPersonal);
		peripheralTextBox.value = (4 * essenceValue) + 1 * wpValue + virtues[3] + virtues[2] + breedingPeripheral * 1;
	}
	else if (exaltedType == 'Lunar') {
    	virtues.sort(compareNum);
		personalTextBox.value = 1 * essenceValue + (2 * parseInt(wpValue));
		peripheralTextBox.value = (4 * essenceValue) + (parseInt(wpValue) * 2) + (4 * virtues[3]);
	}
	else if (exaltedType == 'Sidereal') {
		personalTextBox.value = 2 * essenceValue + 1 * parseInt(wpValue);
		peripheralTextBox.value = (6 * essenceValue) + wpValue + virtues[0] + virtues[1] + virtues[2] + virtues[3];
	}
	else if (exaltedType == 'Raksha') {
		personalTextBox.value = 10 * essenceValue;
		peripheralTextBox.value = 0;
	}
	else if (exaltedType == 'Dragon-King') {
		personalTextBox.value = 10 * essenceValue + 5 * parseInt(wpValue);
		peripheralTextBox.value = 0;
	}
	else if (exaltedType == 'Mountain Folk') {
        if(subType == 'Artisan' || enlightened) {
	        personalTextBox.value = 10 * essenceValue;
	    }
	    else {
		    personalTextBox.value = '0';
		}
		peripheralTextBox.value = '0';
	}
	else {
		alert('Exalted type: ' + exaltedType);
	}
} //end updateEssencePools()

/******************************** Others **************************************/
function addIntimacy() {
    var nodes = document.getElementById('intimacies').childNodes;

    var c = nodes[3].childNodes.length+1;

    var theDivTag = document.createElement('div');
        theDivTag.setAttribute('id', 'intimacy_' + c + '_div');

    var theInputTag = document.createElement('input');
        theInputTag.type = "text";
        theInputTag.name = "intimacies[" + c + "]";
        theInputTag.id = theInputTag.name;
        theInputTag.size = 30;

        theDivTag.appendChild(theInputTag);
    nodes[3].appendChild(theDivTag);
} //end addIntimacy()

function addPassion( ) {

    var nodes = document.getElementById('passions').childNodes;
    //alert(nodes.length);
    var c = nodes.length+1;
    var idPassion = "passions[" + c + "][1]";

    //The HTML-tags
    var theDivTag = document.createElement('div');
    theDivTag.setAttribute('id', idPassion + '_div');
    var theSpanTag = document.createElement('span');
    theSpanTag.setAttribute('id', idPassion + '_dots');
    var theImgTags = new Array();
        for (var i = 0; i < 5; i++) {
        	theImgTags[i] = document.createElement('img');
        	var id = idPassion + "_" + (i+1);
        	theImgTags[i].setAttribute('src', 'images/dot-empty.gif');
        	theImgTags[i].setAttribute('id', id);
        	theImgTags[i].setAttribute('onclick', 'bubble_clicked(\'' + idPassion + '_' + i + '\')');
        	theImgTags[i].setAttribute('alt', 'Dot');
        }
        var theSelectTag = document.createElement('select');
        theSelectTag.setAttribute('id', idPassion);
        theSelectTag.setAttribute('name', idPassion);
        theSelectTag.setAttribute('onchange', 'bubble_clicked(\'' + idPassion + '_\'+this.options[selectedIndex].value)');
        var theOptionTags = new Array();
        for (i = 0; i <= 5 ; i++) {
        	theOptionTags[i] = document.createElement('option');
        	theOptionTags[i].setAttribute('value', i);
        	theOptionTags[i].appendChild(document.createTextNode(i));
        	if(i==0) {
        		theOptionTags[i].setAttribute('selected', 'selected');
        	}
        }

    //Passions
    var passions = document.createElement('input');
    passions.setAttribute('id', 'passions[' + c + '][0]' );
    passions.setAttribute('name', 'passions[' + c + '][0]' );

    //Notes
    var notes = document.createElement('input');
    notes.setAttribute('id', 'passions[' + c + '][2]' );
    notes.setAttribute('name', 'passions[' + c + '][2]' );

    //Prepare the SelectTag
    for (i=0; i<= 5; i++) {
      	theSelectTag.appendChild(theOptionTags[i]);
    }

    //the span tag
    for (i=0; i<5; i++) {
     	theSpanTag.appendChild(theImgTags[i]);
    }
    theSpanTag.appendChild(theSelectTag);

    //the div tag
    theDivTag.appendChild(passions);
    theDivTag.appendChild(theSpanTag);
    theDivTag.appendChild(notes);

    document.getElementById('passions').appendChild(theDivTag);
} //end addPassion() 

function addFetter( ) {

    var nodes = document.getElementById('fetters').childNodes;
    //alert(nodes.length);
    var c = nodes.length+1;
    var idFetters = "fetters[" + c + "][1]";

    //The HTML-tags
    var theDivTag = document.createElement('div');
    theDivTag.setAttribute('id', idFetters + '_div');
    var theSpanTag = document.createElement('span');
    theSpanTag.setAttribute('id', idFetters + '_dots');
    var theImgTags = new Array();
        for (var i = 0; i < 5; i++) {
        	theImgTags[i] = document.createElement('img');
        	var id = idFetters + "_" + (i+1);
        	theImgTags[i].setAttribute('src', 'images/dot-empty.gif');
        	theImgTags[i].setAttribute('id', id);
        	theImgTags[i].setAttribute('onclick', 'bubble_clicked(\'' + idFetters + '_' + i + '\')');
        	theImgTags[i].setAttribute('alt', 'Dot');
        }
        var theSelectTag = document.createElement('select');
        theSelectTag.setAttribute('id', idFetters);
        theSelectTag.setAttribute('name', idFetters);
        theSelectTag.setAttribute('onchange', 'bubble_clicked(\'' + idFetters + '_\'+this.options[selectedIndex].value)');
        var theOptionTags = new Array();
        for (i = 0; i <= 5 ; i++) {
        	theOptionTags[i] = document.createElement('option');
        	theOptionTags[i].setAttribute('value', i);
        	theOptionTags[i].appendChild(document.createTextNode(i));
        	if(i==0) {
        		theOptionTags[i].setAttribute('selected', 'selected');
        	}
        }

    //Passions
    var fetters = document.createElement('input');
    fetters.setAttribute('id', 'fetters[' + c + '][0]' );
    fetters.setAttribute('name', 'fetters[' + c + '][0]' );

    //Notes
    var notes = document.createElement('input');
    notes.setAttribute('id', 'fetters[' + c + '][2]' );
    notes.setAttribute('name', 'fetters[' + c + '][2]' );

    //Prepare the SelectTag
    for (i=0; i<= 5; i++) {
      	theSelectTag.appendChild(theOptionTags[i]);
    }

    //the span tag
    for (i=0; i<5; i++) {
     	theSpanTag.appendChild(theImgTags[i]);
    }
    theSpanTag.appendChild(theSelectTag);

    //the div tag
    theDivTag.appendChild(fetters);
    theDivTag.appendChild(theSpanTag);
    theDivTag.appendChild(notes);

    document.getElementById('fetters').appendChild(theDivTag);
} //end addFetters()

function addCollege( ) {
    var arrColleges = new Array();
    arrColleges[0] = "The Captain";
    arrColleges[1] = "The Gull";
    arrColleges[2] = "The Mast";
    arrColleges[3] = "The Messenger";
    arrColleges[4] = "The Ship's Wheel";
    arrColleges[5] = "The Ewer";
    arrColleges[6] = "The Lovers";
    arrColleges[7] = "The Musician";
    arrColleges[8] = "The Peacock";
    arrColleges[9] = "The Pillar";
    arrColleges[10] = "The Banner";
    arrColleges[11] = "The Gauntlet";
    arrColleges[12] = "The Quiver";
    arrColleges[13] = "The Shield";
    arrColleges[14] = "The Spear";
    arrColleges[15] = "The Guardians";
    arrColleges[16] = "The Key";
    arrColleges[17] = "The Mask";
    arrColleges[18] = "The Sorcerer";
    arrColleges[19] = "The Treasure Trove";
    arrColleges[20] = "The Corpse";
    arrColleges[21] = "The Crow";
    arrColleges[22] = "The Haywain";
    arrColleges[23] = "The Rising Smoke";
    arrColleges[24] = "The Sword";

    var nodes = document.getElementById('colleges').childNodes;
    var c = nodes[3].childNodes.length+1;
    var idCollege = "colleges[" + c + "][1]";

    //The HTML-tags
    var theDivTag = document.createElement('div');
    theDivTag.setAttribute('id', idCollege + '_div');
    var theSpanTag = document.createElement('span');
    theSpanTag.setAttribute('id', idCollege + '_dots');
    var theImgTags = new Array();
        for (var i = 0; i < 5; i++) {
        	theImgTags[i] = document.createElement('img');
        	var id = idCollege + "_" + (i+1);
        	theImgTags[i].setAttribute('src', 'images/dot-empty.gif');
        	theImgTags[i].setAttribute('id', id);
        	theImgTags[i].setAttribute('onclick', 'bubble_clicked(\'' + idCollege + '_' + i + '\')');
        	theImgTags[i].setAttribute('alt', 'Dot');
        }
        var theSelectTag = document.createElement('select');
        theSelectTag.setAttribute('id', idCollege);
        theSelectTag.setAttribute('name', idCollege);
        theSelectTag.setAttribute('onchange', 'bubble_clicked(\'' + idCollege + '_\'+this.options[selectedIndex].value)');
        var theOptionTags = new Array();
        for (i = 0; i <= 5 ; i++) {
        	theOptionTags[i] = document.createElement('option');
        	theOptionTags[i].setAttribute('value', i);
        	theOptionTags[i].appendChild(document.createTextNode(i));
        	if(i==0) {
        		theOptionTags[i].setAttribute('selected', 'selected');
        	}
        }

    //Colleges
    var colleges = document.createElement('select');
    colleges.setAttribute('id', 'colleges[' + c + '][0]' );
    colleges.setAttribute('name', 'colleges[' + c + '][0]' );

    for (i = 0; i < 25; i++) {
        option = document.createElement('option');
        option.setAttribute('value', arrColleges[i]);
        option.appendChild(document.createTextNode(arrColleges[i]));
        colleges.appendChild(option);
    }

    //Prepare the SelectTag
    for (i=0; i<= 5; i++) {
      	theSelectTag.appendChild(theOptionTags[i]);
    }

    //the span tag
    for (i=0; i<5; i++) {
     	theSpanTag.appendChild(theImgTags[i]);
    }
    theSpanTag.appendChild(theSelectTag);

    //the div tag
    theDivTag.appendChild(colleges);
    theDivTag.appendChild(theSpanTag);

    nodes[3].appendChild(theDivTag);
} //end addCollege()


function addCombo() {
 /*
<div>
    <div id="combo_name_div">Name: <input type="text" name="combo_name" id="combo[0][name]" maxlength="255" /></div>
    <div id="combo_cost_div">Minimum Cost: <input type="text" name="combo_cost" id="combo_cost" maxlength="255"/></div>
    <div id="combo_description_div">Description: <br/>
        <textarea name="combo_description" cols="60" rows="5"  onkeydown="limitText(this.form.combo_description,this.form.combo_description_countdown,500);"
    onkeyup="limitText(this.form.combo_description,this.form.combo_description_countdown,500);">
        </textarea><br/>
        (Maximum characters: 500)<br/>
        You have <input readonly="readonly" type="text" name="combo_description_countdown" size="3" value="500"/> characters left.</div>
   <div id="combo_charms_div">Charms, separated by a comma: <br/>
        <textarea name="combo_charms" cols="60" rows="5">
        </textarea></div>
        </div>
*/
    var nodes = document.getElementById('combos_div').childNodes;
    var c = nodes[3].childNodes.length+1;
    var idCombo = "combos[" + c + "]";
    var id;
//The HTML-tags
    var theDivTag = document.createElement('div');

    //name
    var nameDiv = document.createElement('div');
    id = idCombo + '[name]';
    nameDiv.setAttribute('id', id + '_div');
    nameDiv.appendChild(document.createTextNode("Name: "));
    var nameInput = document.createElement('input');
    nameInput.setAttribute('type', 'text');
    nameInput.setAttribute('name', id);
    nameInput.setAttribute('id', id);
    nameInput.setAttribute('maxlength', '255');
    nameDiv.appendChild(nameInput);

    //cost
    var costDiv = document.createElement('div');
    id = idCombo + '[cost]';
    costDiv.setAttribute('id', id + '_div');
    costDiv.appendChild(document.createTextNode("Minimum Cost: "));
    var costInput = document.createElement('input');
    costInput.setAttribute('type', 'text');
    costInput.setAttribute('name', id);
    costInput.setAttribute('id', id);
    costInput.setAttribute('maxlength', '255');
    costDiv.appendChild(costInput);

    //description
    var descriptionDiv = document.createElement('div');
    id = idCombo + '[description]';
    descriptionDiv.setAttribute('id', id + '_div');
    descriptionDiv.appendChild(document.createTextNode("Description: "));
    descriptionDiv.appendChild(document.createElement('br'));
    var descriptionTA = document.createElement('textarea');
    descriptionTA.setAttribute('name', id);
    descriptionTA.setAttribute('cols', '60');
    descriptionTA.setAttribute('rows', '5');
    /*var arg1 = 'this.form.' + id;
    var arg2 = 'this.form.' + id + '_countdown';
    descriptionTA.setAttribute("onkeydown", "limitText(' + arg1 +',' + arg2 +',500)");
    descriptionTA.setAttribute("onkeyup", "limitText(' + arg1 +',' + arg2 +',500)");*/
    descriptionDiv.appendChild(descriptionTA);
    /*descriptionDiv.appendChild(document.createElement('br'));
    descriptionDiv.appendChild(document.createTextNode('Maximum characters: 500'));
    descriptionDiv.appendChild(document.createElement('br'));
    descriptionDiv.appendChild(document.createTextNode('You have '));
    var countdownInput = document.createElement('input');
    countdownInput.setAttribute('readonly', 'readonly');
    countdownInput.setAttribute('type', 'text');
    countdownInput.setAttribute('name', id + '_countdown');
    countdownInput.setAttribute('id', id + '_countdown');
    countdownInput.setAttribute('size', '3');
    countdownInput.setAttribute('value', '500');
    descriptionDiv.appendChild(countdownInput);
    descriptionDiv.appendChild(document.createTextNode(' characters left.'));
    */

    /*
    <div id="combo_charms_div">Charms, separated by a comma: <br/>
        <textarea name="combo_charms" cols="60" rows="5">
        </textarea></div>
    */
    //charms
    var charmsDiv = document.createElement('div');
    id = idCombo + '[charms]';
    charmsDiv.setAttribute('id', id + '_div');
    charmsDiv.appendChild(document.createTextNode("Charms, separated by a comma: "));
    charmsDiv.appendChild(document.createElement('br'));
    var charmsTA = document.createElement('textarea');
    charmsTA.setAttribute('name', id);
    charmsTA.setAttribute('cols', '60');
    charmsTA.setAttribute('rows', '5');
    charmsDiv.appendChild(charmsTA);

    //the div tag
    theDivTag.appendChild(nameDiv);
    theDivTag.appendChild(costDiv);
    theDivTag.appendChild(descriptionDiv);
    theDivTag.appendChild(charmsDiv);

    nodes[3].appendChild(theDivTag);
} //addCombo()

/******************************** Tables **************************************/
function addNewRow(table, offset) {
	var rowNum = document.getElementById(table).rows.length;
	replaceNum = rowNum + offset;
	var x=document.getElementById(table).insertRow(document.getElementById(table).rows.length);

    for (var i = 2; i < arguments.length; i++) {
		s = new String(arguments[i]);
		var y=x.insertCell(i-2);
		while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', replaceNum);
		}
		y.innerHTML=s;
    }
	return replaceNum;
} //end addNewRow(table, offset)

function addCraftsRow() {
    var crafts = '<select name="crafts[{row_num}][0]" id="crafts[{row_num}][0]">\
    <option value="" selected="selected">-</option>\
    <option value="Fire">Fire</option>\
    <option value="Water">Water</option>\
    <option value="Earth">Earth</option>\
    <option value="Air">Air</option>\
    <option value="Wood">Wood</option>\
    <option value="Magitech">Magitech</option>\
    <option value="Genesis">Genesis</option>\
    <option value="Glamour">Glamour</option>\
    <option value="Fate">Fate</option>\
    </select>';

    var exaltedSelect = document.getElementById('exalt_type');
    var exaltedType = exaltedSelect.options[exaltedSelect.selectedIndex].value;
    var max = 5;
    if( exaltedType == "Raksha" || exaltedType == "Dragon-King" || exaltedType == "Mountain Folk" ) {
        max = 7;
    }
    addNewRow('crafts_table', -1, crafts, bubbles( "crafts[{row_num}][1]", max, false, false ) + " " + addNumberSelect( "crafts[{row_num}][1]", max, 0, false ) );

} //end addCraftsRow()

function addLanguageRow() {
    var arrLanguages = '<select name="languages[{row_num}][0]" id="languages[{row_num}][0]">\
    <option value="" selected="selected">-</option>\
    <option value="11">Claw Speak</option> \
<option value="6">Flametongue</option> \
<option value="7">Forest-tongue</option> \
<option value="8">Guild Cant</option> \
<option value="10">High Holy Speak</option> \
<option value="1">High Realm</option> \
<option value="2">Low Realm</option> \
<option value="3">Old Realm</option> \
<option value="14">Other</option> \
<option value="4">Riverspeak</option> \
<option value="13">Rocktongue</option> \
<option value="12">Seatongue</option> \
<option value="5">Skytongue</option> \
<option value="9">Tribal Tongue</option> \
    </select>';
	addNewRow('languages_table', 0, arrLanguages,  '<input name="languages[{row_num}][1]" type="text" size="19">');

}//end addLanguageRow()

function addSpecialityRow() {
    var arrAbilities = '<select name="specialities[{row_num}][0]" id="specialities[{row_num}][0]">\
    <option value="" selected>-</option>\
    <option value="Archery">Archery</option>\
    <option value="Athletics">Athletics</option>\
    <option value="Awareness">Awareness</option>\
    <option value="Bureaucracy">Bureaucracy</option>\
    <option value="Crafts">Crafts</option>\
    <option value="Dodge">Dodge</option>\
    <option value="Integrity">Integrity</option>\
    <option value="Investigation">Investigation</option>\
    <option value="Larceny">Larceny</option>\
    <option value="Lore">Lore</option>\
    <option value="Linguistics">Linguistics</option>\
    <option value="Martial Arts">Martial Arts</option>\
    <option value="Medicine">Medicine</option>\
    <option value="Melee">Melee</option>\
    <option value="Occult">Occult</option>\
    <option value="Performance">Performance</option>\
    <option value="Presence">Presence</option>\
    <option value="Resistance">Resistance</option>\
    <option value="Ride">Ride</option>\
    <option value="Sail">Sail</option>\
    <option value="Socialize">Socialize</option>\
    <option value="Stealth">Stealth</option>\
    <option value="Survival">Survival</option>\
    <option value="Thrown">Thrown</option>\
    <option value="War">War</option>\
    \
    <option class="Lunar" value="">---</option>\
    <option class="Lunar" value="Strength">Strength</option>\
    <option class="Lunar" value="Dexterity">Dexterity</option>\
    <option class="Lunar" value="Stamina">Stamina</option>\
    <option class="Lunar" value="Charisma">Charisma</option>\
    <option class="Lunar" value="Manipulation">Manipulation</option>\
    <option class="Lunar" value="Appearance">Appearance</option>\
    <option class="Lunar" value="Perception">Perception</option>\
    <option class="Lunar" value="Intelligence">Intelligence</option>\
    <option class="Lunar" value="Wits">Wits</option>\
    </select>';

	addNewRow('specialities_table', -1, arrAbilities, '<input type="text" name="specialities[{row_num}][1]">', '<img src="images/dot-empty.gif" id="specialities[{row_num}][2]_1" onclick="bubble_clicked(\'specialities[{row_num}][2]_1\'); "\><img src="images/dot-empty.gif" id="specialities[{row_num}][2]_2" onclick="bubble_clicked(\'specialities[{row_num}][2]_2\'); "\><img src="images/dot-empty.gif" id="specialities[{row_num}][2]_3" onclick="bubble_clicked(\'specialities[{row_num}][2]_3\'); "\><select name="specialities[{row_num}][2]" id="specialities[{row_num}][2]" onchange="bubble_clicked(\'specialities[{row_num}][2]_\'+this.options[selectedIndex].value); "> <option value="0" selected>0</option>  <option value="1">1</option>  <option value="2">2</option>  <option value="3">3</option></select>');
} //end addSpecialtyRow()

function addBackgroundRow() {
    var backgrounds = '<select name="backgrounds[{row_num}][0]" id="backgrounds[{row_num}][0]" onchange="updateEssencePools();">\
    <option value="" selected="selected">-</option>\
    <option value="Allies">Allies</option>\
    <option value="Artifact">Artifact</option>\
    <option value="Backing">Backing</option>\
    <option value="Contacts">Contacts</option>\
    <option value="Cult">Cult</option>\
    <option value="Face">Face</option>\
    <option value="Familiar">Familiar</option>\
    <option value="Followers">Followers</option>\
    <option value="Influence">Influence</option>\
    <option value="Manse">Manse</option>\
    <option value="Mentor">Mentor</option>\
    <option value="Resources">Resources</option>\
    <option value="Arsenal" class="Dragon-Blooded">Arsenal</option>\
    <option value="Breeding" class="Dragon-Blooded">Breeding</option>\
    <option value="Command" class="Dragon-Blooded">Command</option>\
    <option value="Connections" class="Dragon-Blooded">Connections</option>\
    <option value="Destiny" class="Dragon-Blooded">Destiny</option>\
    <option value="Family" class="Dragon-Blooded">Family</option>\
    <option value="Henchmen" class="Dragon-Blooded">Henchmen</option>\
    <option value="Reputation" class="Dragon-Blooded">Reputation</option>\
    <option value="Retainers" class="Dragon-Blooded">Retainers</option>\
    <option value="Heart\'s Blood" class="Lunar">Heart\'s Blood</option>\
    <option value="Reputation" class="Lunar">Reputation</option>\
    <option value="Solar Bond" class="Lunar">Solar Bond</option>\
    <option value="Tattoo Artifact" class="Lunar">Tattoo Artifact</option>\
    <option value="Abyssal Command" class="Abyssal">Abyssal Command</option>\
    <option value="Liege" class="Abyssal">Liege</option>\
    <option value="Spies" class="Abyssal">Spies</option>\
    <option value="Underworld Manse" class="Abyssal">Underworld Manse</option>\
    <option value="Whispers" class="Abyssal">Whispers</option>\
    <option value="Celestial Manse" class="Sidereal">Celestial Manse</option>\
    <option value="Sifu" class="Sidereal">Sifu</option>\
    <option value="Savant" class="Sidereal">Savant</option>\
    <option value="Salary" class="Sidereal">Salary</option>\
    <option value="Acquaintances" class="Sidereal">Acquaintances</option>\
    <option value="Familiar(Demonic)" class="Infernal">Familiar(Demonic)</option>\
    <option value="Infernal Manse" class="Infernal">Infernal Manse</option>\
    <option value="Past Life" class="Infernal">Past Life</option>\
    <option value="Savant" class="Infernal">Savant</option>\
    <option value="Spies" class="Infernal">Spies</option>\
    <option value="Unwoven Coadjutor" class="Infernal">Unwoven Coadjutor</option>\
    <option value="Birth" class="Raksha">Birth</option>\
    <option value="Freehold" class="Raksha">Freehold</option>\
    <option value="Gossamer" class="Raksha">Gossamer</option>\
    <option value="Retinue" class="Raksha">Retinue</option>\
    <option value="Style" class="Raksha">Style</option>\
    <option value="Command" class="Heroic Mortal Beastman God-Blooded">Command</option>\
    <option value="Destiny" class="Heroic Mortal Beastman God-Blooded">Destiny</option>\
    <option value="Esoteric Knowledge" class="Heroic Mortal Beastman">Esoteric Knowledge</option>\
    <option value="Henchmen" class="Heroic Mortal Beastman God-Blooded">Henchmen</option>\
    <option value="Library" class="Heroic Mortal Beastman God-Blooded">Library</option>\
    <option value="Henchmen" class="Heroic Mortal Beastman God-Blooded">Patron</option>\
    <option value="Retainers" class="Heroic Mortal Beastman God-Blooded">Retainers</option>\
    <option value="Sifu" class="Heroic Mortal Beastman God-Blooded">Sifu</option>\
    <option value="Spies" class="Heroic Mortal Beastman God-Blooded">Spies</option>\
    <option value="Inheritance" class="God-Blooded">Inheritance</option>\
    <option value="Age" class="Heroic Ghost">Age</option>\
    <option value="Ancestor Cult" class="Heroic Ghost">Ancestor Cult</option>\
    <option value="Grave Goods" class="Heroic Ghost">Grave Goods</option>\
    <option value="Underworld Cult" class="Heroic Ghost">Underworld Cult</option>\
    <option value="Whispers" class="Heroic Ghost">Whispers</option>\
    </select>';

	var rowNum = addNewRow('backgrounds_table',	-1, backgrounds, '<img src="images/dot-empty.gif" id="backgrounds[{row_num}][1]_1" onclick="bubble_clicked(\'backgrounds[{row_num}][1]_1\'); updateEssencePools()"><img src="images/dot-empty.gif" id="backgrounds[{row_num}][1]_2" onclick="bubble_clicked(\'backgrounds[{row_num}][1]_2\'); updateEssencePools()"><img src="images/dot-empty.gif" id="backgrounds[{row_num}][1]_3" onclick="bubble_clicked(\'backgrounds[{row_num}][1]_3\'); updateEssencePools()"><img src="images/dot-empty.gif" id="backgrounds[{row_num}][1]_4" onclick="bubble_clicked(\'backgrounds[{row_num}][1]_4\'); updateEssencePools()"><img src="images/dot-empty.gif" id="backgrounds[{row_num}][1]_5" onclick="bubble_clicked(\'backgrounds[{row_num}][1]_5\'); updateEssencePools()"> <select name="backgrounds[{row_num}][1]" id="backgrounds[{row_num}][1]" onchange="bubble_clicked(\'backgrounds[{row_num}][1]_\'+this.options[selectedIndex].value); updateEssencePools()">  <option value="0" selected>0</option>  <option value="1">1</option>  <option value="2">2</option>  <option value="3">3</option>  <option value="4">4</option>  <option value="5">5</option></select>',
	'<input type="text" size="15" name="backgrounds[{row_num}][2]"/>');

	dynamicSelect('exalt_type', 'backgrounds[' + rowNum + '][0]');

} //end addBackgroundRow()

function addMutationRow( tname ) {
    var arrTypes = '<select name="' + tname + '[{row_num}][1]" id="' + tname + '[{row_num}][1]">\
    <option value="" selected="selected">-</option>\
    <option value="1">Pox</option>\
    <option value="-1">Deficiency</option>\
    <option value="2">Affliction</option>\
    <option value="-2">Debility</option>\
    <option value="4">Blight</option>\
    <option value="-4">Deformity</option>\
    <option value="6">Abomination</option>\
    </select>';

    addNewRow( tname + '_table', -1, '<input type="text" name="' + tname + '[{row_num}][0]">', arrTypes,'<input type="text" name="' + tname + '[{row_num}][2]">');

} //end addMutationRow()

function addMeritRow() {
    addNewRow( 'merits_table', -1, '<input type="text" name="merits[{row_num}][0]">', '<input type="text" name="merits[{row_num}][1]" size="2">', '<input type="text" name="merits[{row_num}][2]">' );
} //addMeritRow()

function addFlawRow() {
    addNewRow( 'flaws_table', -1, '<input type="text" name="flaws[{row_num}][0]">', '<input type="text" name="flaws[{row_num}][1]" size="2">', '<input type="text" name="flaws[{row_num}][2]">' );
} //addFlawRow()

function addAssumptionPowerRow() {
    addNewRow( 'assumption_powers_table', -1, '<input type="text" name="assumption_powers[{row_num}][0]">', '<input type="text" name="assumption_powers[{row_num}][1]">', '<input type="text" name="assumption_powers[{row_num}][2]" size="2">' );
} //addAssumptionPowerRow()

function addShapeRow() {
    var types = '<select name="shapes[{row_num}][0]" id="shapes[{row_num}][0]">\
    <option value="animal">Animal</option>\
    <option value="human">Human</option>\
    <option value="mutant">Mutant</option>\
    <option value="demon">Demon</option>\
    <option value="elemental">Elemental</option>\
    <option value="god">God</option>\
    <option value="plant">Plant</option>\
    <option value="behemot">Behemot</option>\
    </select>';
    addNewRow( 'shapes_table', -1, types, '<input type="text" name="shapes[{row_num}][1]">', '<input type="text" name="shapes[{row_num}][2]">' );
} //addShapeRow()

function addExcellencyRow( ) {
    var excellenciesName = '<select name="excellencies[{row_num}][1]" id="excellencies[{row_num}][1]">\
    <option class="Solar  Abyssal" value="Essence Flow">Essence Flow</option>\
\
<option class="Solar  Abyssal  Infernal  Lunar  Sidereal  Dragon-Blooded  Raksha" value="1st Excellency">1st Excellency - Essence Overwhelming</option>\
<option class="Solar  Abyssal  Infernal  Lunar  Sidereal  Dragon-Blooded  Raksha" value="2nd Excellency">2nd Excellency - Essence Triumphant</option>\
<option class="Solar  Abyssal  Lunar  Sidereal  Dragon-Blooded  Raksha" value="3rd Excellency">3rd Excellency - Essence Resurgent</option>\
\
<option class="Sidereal" value="Fateful Excellenc">Fateful Excellency - Essence Auspicious</option>\
<option class="Lunar" value="Flawless Focus">Flawless Focus</option>\
<option class="Solar  Abyssal" value="Infinite Mastery">Infinite Mastery</option>\
<option class="Lunar" value="Instinctive Unity">Instinctive Unity</option>\
<option class="Sidereal" value="Propitious Alignment">Propitious Alignment</option>\
<option class="Abyssal" value="Ravening Mouth of">Ravening Mouth of</option>\
<option class="Dragon-Blooded" value="Terrestrial Reinforcement">Terrestrial Reinforcement</option>\
<option class="Infernal" value="Mythos Exultant">Mythos Exultant</option>\
<option class="Infernal" value="Inevitability Technique">Inevitability Technique</option>\
<option class="Infernal" value="Effortless Dominance">Effortless Dominance</option>\
<option class="Infernal" value="So Speaks">So Speaks</option>\
<option class="Raksha" value="Unassailable Tower of">Unassailable Tower of</option>\
    </select>';

    var excellenciesTrait = '<select name="excellencies[{row_num}][2]" id="excellencies[{row_num}][2]">\
    <option value="Solar Abyssal Dragon-Blooded Sidereal Raksha" selected>---</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Archery">Archery</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Athletics">Athletics</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Awareness">Awareness</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Bureaucracy">Bureaucracy</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Crafts">Crafts</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Dodge">Dodge</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Integrity">Integrity</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Investigation">Investigation</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Larceny">Larceny</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Lore">Lore</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Linguistics">Linguistics</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Martial Arts">Martial Arts</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Medicine">Medicine</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Melee">Melee</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Occult">Occult</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Performance">Performance</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Presence">Presence</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Resistance">Resistance</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Ride">Ride</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Sail">Sail</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Socialize">Socialize</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Stealth">Stealth</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Survival">Survival</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="Thrown">Thrown</option>\
    <option class="Solar Abyssal Dragon-Blooded Sidereal Raksha" value="War">War</option>\
    \
    <option class="Lunar" value="">---</option>\
    <option class="Lunar" value="Strength">Strength</option>\
    <option class="Lunar" value="Dexterity">Dexterity</option>\
    <option class="Lunar" value="Stamina">Stamina</option>\
    <option class="Lunar" value="Charisma">Charisma</option>\
    <option class="Lunar" value="Manipulation">Manipulation</option>\
    <option class="Lunar" value="Appearance">Appearance</option>\
    <option class="Lunar" value="Perception">Perception</option>\
    <option class="Lunar" value="Intelligence">Intelligence</option>\
    <option class="Lunar" value="Wits">Wits</option>\
    \
    <option class="Infernal" value="">---</option>\
    <option class="Infernal" value="Malfeas"    >Malfeas</option>\
    <option class="Infernal" value="Cecelyne">Cecelyne</option>\
    <option class="Infernal" value="Adorjan"      >Adorjan</option>\
    <option class="Infernal" value="Ebon Dragon"    >Ebon Dragon</option>\
    <option class="Infernal" value="She Who Lives In Her Name"    >She Who Lives In Her Name</option>\
    \
    <option class="Raksha" value="Heart">Heart</option>\
    <option class="Raksha" value="Cup"    >Cup</option>\
    <option class="Raksha" value="Ring">Ring</option>\
    <option class="Raksha" value="Staff"      >Staff</option>\
    <option class="Raksha" value="Sword"    >Sword</option>\
    </select>';

    var rowNum = addNewRow( 'excellencies_table', -1, '<input type="text" name="excellencies[{row_num}][0]" size="2" value="1"/>', excellenciesName, excellenciesTrait );
    
    var exaltedSelect = document.getElementById('exalt_type');
	var exaltedType = exaltedSelect.options[exaltedSelect.selectedIndex].value;
    var sort = "exalt_type";
    if( exaltedType == 'God-Blooded') {
        sort = "exalt_subtype";
    }
        dynamicSelect(sort, "excellencies[" + rowNum + "][1]");
	    dynamicSelect(sort, "excellencies[" + rowNum + "][2]");

} //addExcellencyRow( )

function addShieldRow() {
    //<tr><th>Name</th><th colspan="2">PDV (close/range)</th><th colspan="2">DDV (close/range)</th><th>Mob</th><th>Fat</th><th>Att</th></tr>
    addNewRow( 'shields_table', -1, '<input type="text" name="shields[{row_num}][0]"/>', '<input type="text" name="shields[{row_num}][1]" size="1"/>', '<input type="text" name="shields[{row_num}][2]" size="1"/>', '<input type="text" name="shields[{row_num}][3]" size="1"/>', '<input type="text" name="shields[{row_num}][4]" size="1"/>', '<input type="text" name="shields[{row_num}][5]" size="1"/>', '<input type="text" name="shields[{row_num}][6]" size="1"/>', '<input type="text" name="shields[{row_num}][7]" size="1"/>' );
} //addShieldRow()

function addSpellRow() {
    var circles = '<select name="spells[{row_num}][1]" id="spells[{row_num}][1]">\
    <option value="Terrestrial">Terrestrial</option>\
    <option value="Celestial">Celestial</option>\
    <option value="Solar">Solar</option>\
    <option value="Shadowland">Shadowland</option>\
    <option value="Labyrinth">Labyrinth</option>\
    <option value="Void">Void</option>\
    </select>';

    addNewRow( 'spells_table', -1, '<input type="text" name="spells[{row_num}][0]" maxlength="255" size="11">', circles, '<input type="text" name="spells[{row_num}][2]" size="2" maxlength="255">', '<input type="text" name="spells[{row_num}][3]" size="11" maxlength="255">', booksSelect( 'spells[{row_num}][4]' ) + '<input type="text" name="spells[{row_num}][3]" size="2">' );
} //addSpellRow()

function addEquipmentRow() {
    addNewRow( 'equipment_table', -1, '<input type="text" name="equipment[{row_num}][0]" maxlength="255">', '<input type="text" name="equipment[{row_num}][1]" maxlength="255">', '<input type="checkbox" name="equipment[{row_num}][3]">' );
} //addEquipmentRow()

function addWeaponRows() {
    var table = "weapons_table";
    //var rowNum = document.getElementById(table).rows.length; //2 at start, so put a -1 there?
    var rowNum = document.getElementById(table).rows.length -1;
    //var replaceNum = Math.ceil(rowNum/2); //1,1 2,2 3,3, etc


    var x=document.getElementById(table).insertRow(document.getElementById(table).rows.length);

    //Name
    s = '<input name="weapons[{row_num}][0]" type="text" />';
    y = x.insertCell(0);
    y.colSpan = 3;
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

    //Type
	s = '<select name="weapons[{row_num}][1]"> \
    <option value="a">Archery</option> \
    <option value="ma">Martial Arts</option> \
    <option value="m">Melee</option> \
    <option value="t">Thrown</option></select>';

    y = x.insertCell(1);
    y.colSpan = 3;

    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

    //Notes
    s = '<input name="weapons[{row_num}][2]" type="text" />';
    
    y = x.insertCell(2);
    y.colSpan = 2;
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

    x=document.getElementById(table).insertRow(document.getElementById(table).rows.length);

    //Speed
    s = '<input name="weapons[{row_num}][3]" type="text" size="1"/>';
    y = x.insertCell(0);
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

	//Accuracy
    s = '<input name="weapons[{row_num}][4]" type="text" size="1"/>';
    y = x.insertCell(1);
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

    //Damage
	s = '<input name="weapons[{row_num}][5][0]" type="text" size="1"/><select name="weapons[{row_num}][5][1]" type="text"><option value="b">B</option><option value="l">L</option><option value="a">A</option></select>/<input name="weapons[{row_num}][5][2]" type="text" size="1"/>';
    y = x.insertCell(2);
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

	//Defense
    s = '<input name="weapons[{row_num}][6]" type="text" size="1"/>';
    y = x.insertCell(3);
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

	//Attune
    s = '<input name="weapons[{row_num}][7]" type="text" size="1"/>';
    y = x.insertCell(4);
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

	//Range
    s = '<input name="weapons[{row_num}][8]" type="text" size="1"/>';
    y = x.insertCell(5);
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

	//Rate
    s = '<input name="weapons[{row_num}][9]" type="text" size="1"/>';
    y = x.insertCell(6);
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

	//Tags
    s = '<input name="weapons[{row_num}][10]" type="text" size="7"/>';
    y = x.insertCell(7);
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

} //end addWeaponRows()

function addArmorRows() {
	//addNewRow('armor_table', 0, '<input name="armors[{row_num}][0]" type="text" size="16"/>', '<input name="armors[{row_num}][1]" type="text" size="1"/>', '<input name="armors[{row_num}][2]" type="text" size="1"/>', '<input name="armors[{row_num}][3]" type="text" size="1"/>', '<input name="armors[{row_num}][4]" type="text" size="1"/>', '<input name="armors[{row_num}][5]" type="text" size="1"/>', '<input name="armors[{row_num}][6]" type="text" size="1"/>', '<input name="armors[{row_num}][7]" type="text" size="1"/>', '<input name="armors[{row_num}][8]" type="text" size="12"/>');
    var table = "armor_table";
    //var rowNum = document.getElementById(table).rows.length; //2 at start, so put a -1 there?
    var rowNum = document.getElementById(table).rows.length -1;
    //var replaceNum = Math.ceil(rowNum/2); //1,1 2,2 3,3, etc


    var x=document.getElementById(table).insertRow(document.getElementById(table).rows.length);

    //Name
    s = '<input name="armors[{row_num}][0]" type="text" />';
    y = x.insertCell(0);
    y.colSpan = 3;
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

    //Lethal soak
    s = '<input name="armors[{row_num}][1][0]" type="text" size="1"/>';
    y = x.insertCell(1);
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

	//Bashing soak
    s = '<input name="armors[{row_num}][1][1]" type="text" size="1"/>';
    y = x.insertCell(2);
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

	//Lethal Hardness
    s = '<input name="armors[{row_num}][2][0]" type="text" size="1"/>';
    y = x.insertCell(3);
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

    //Bashing Hardness
    s = '<input name="armors[{row_num}][2][1]" type="text" size="1"/>';
    y = x.insertCell(4);
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

    //Notes
    s = '<input name="armors[{row_num}][3]" type="text" />';
    y = x.insertCell(5);
    y.colSpan = 3;
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

    x=document.getElementById(table).insertRow(document.getElementById(table).rows.length);

    //Fatigue
    s = '<input name="armors[{row_num}][4]" type="text" size="1"/>';
    y = x.insertCell(0);
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

	//Mobility
    s = '<input name="armors[{row_num}][5]" type="text" size="1"/>';
    y = x.insertCell(1);
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

    //Attune
	s = '<input name="armors[{row_num}][6]" type="text" size="1"/>';
    y = x.insertCell(2);
    while (s.indexOf('{row_num}') > -1) {
			s = s.replace('{row_num}', rowNum); //Replace {row_num} med radnummer
	}
	y.innerHTML = s;

    //Empty cells
    y = x.insertCell(3);
    y.colSpan = 5;
} //end addArmorRows()


function booksSelect( id ) {
    var arrTypes = '<select name="' + id + '" id="' + id + '">\
    <option value="CoCD:BI">CoCD:BI</option>\
<option value="CoCD:M">CoCD:M</option>\
<option value="CoCD:U">CoCD:U</option>\
<option value="CoCD:W">CoCD:W</option>\
<option value="CoCD:YS">CoCD:YS</option>\
<option value="CoTD:E">CoTD:E</option>\
<option value="CoTD:N">CoTD:N</option>\
<option value="CoTD:S">CoTD:S</option>\
<option value="CoTD:SL">CoTD:SL</option>\
<option value="CoTD:W">CoTD:W</option>\
<option value="Custom">Custom</option>\
<option value="Ex2">Ex2</option>\
<option value="Ex2:STC">Ex2:STC</option>\
<option value="GotMH:L">GotMH:L</option>\
<option value="GotMH:MoD">GotMH:MoD</option>\
<option value="GotMH:UCS">GotMH:UCS</option>\
<option value="GWM">GWM</option>\
<option value="MoEP:A">MoEP:A</option>\
<option value="MoEP:DB">MoEP:DB</option>\
<option value="MoEP:I">MoEP:I</option>\
<option value="MoEP:L">MoEP:L</option>\
<option value="MoEP:S">MoEP:S</option>\
<option value="OC">OC</option>\
<option value="RoGD2">RoGD2</option>\
<option value="RoGD2:LAotD">RoGD2:LAotD</option>\
<option value="RogD:G&E">RogD:G&E</option>\
<option value="SoFR">SoFR</option>\
<option value="SoH">SoH</option>\
<option value="SoK">SoK</option>\
<option value="SotM">SotM</option>\
<option value="SotM:IL">SotM:IL</option>\
<option value="SotW">SotW</option>\
<option value="WaBT">WaBT</option>\
<option value="WotLA">WotLA</option>\
<option value="Custom">Custom</option>\
 </select>';

 return arrTypes;
} //booksSelect( id )
/********************************* Misc ***************************************/


function bubbles( name, number, firstFilledIn, forEssence ) {
    var filled = "images/dot-filled.gif";
    var empty = "images/dot-empty.gif";
    var bubbles = "test";
    var i;
    
    if(forEssence == true) {
        if( firstFilledIn == true ) {
            //bubbles = "<img src=\"" + filled + "\" id=\"" + name + "_1\" onclick=\"bubble_clicked('" + name + "_1'); updateEssencePools() \" alt=\"Filled Dot\" \\>";
            bubbles = "<img src=\"" + filled + "\" id=\"" + name + "_1\" onclick=\"bubble_clicked('" + name + "_1'); updateEssencePools() \" alt=\"Filled Dot\" \\>";
        }
	else {
            //bubbles = "<img src=\"" + empty + "\" id=\"" + name + "_1\" onclick=\"bubble_clicked('" + name + "_1'); updateEssencePools() \" alt=\"Empty Dot\" \\>";
            bubbles = "<img src=\"" + empty + "\" id=\"" + name + "_1\" onclick=\"bubble_clicked('" + name + "_1'); updateEssencePools() \" alt=\"Empty Dot\" \\>";
	}
	for(i = 1; i < number; i++) {
            if(i==5) {
                bubbles += " ";
            }
            //bubbles += "<img src=\"" + empty + "\" id=\"" + name + "_" + (i+1) + "\" onclick=\"bubble_clicked('" + name + "_" + (i+1) "'); updateEssencePools() \" alt=\"Empty Dot\"\\>";
            bubbles += "<img src=\"" + empty + "\" id=\"" + name + "_" + (i+1) + "\" onclick=\"bubble_clicked('" + name + "_" + (i+1) + "'); updateEssencePools() \" alt=\"Empty Dot\" \\>";
        }
    
    }
    else {
    	if( firstFilledIn == true ) {
            bubbles = "<img src=\"" + filled + "\" id=\"" + name + "_1\" onclick=\"bubble_clicked('" + name + "_1') \" alt=\"Filled Dot\" \\>";
        }
	else {
            bubbles = "<img src=\"" + empty + "\" id=\"" + name + "_1\" onclick=\"bubble_clicked('" + name + "_1') \" alt=\"Empty Dot\" \\>";
        }
	for(i = 1; i < number; i++) {
            if(i==5) {
                bubbles += " ";
            }
            bubbles += "<img src=\"" + empty + "\" id=\"" + name + "_" + (i+1) + "\" onclick=\"bubble_clicked('" + name + "_" + (i+1) + "') \" alt=\"Empty Dot\" \\>";
        }
    }
    return bubbles;
} //bubbles( name, number, firstFilledIn, forEssence )

function addNumberSelect( name, number, selected, forEssence ) {
    var select = "<select id=\"" + name + "\" name=\"" + name + "\"onchange=\"bubble_clicked('" + name + "_'+this.options[selectedIndex].value);";
    if(forEssence == true) {
        select += " updateEssencePools()";
    }
    select += "\"> ";
    for( var i = 0; i <= number; i++ ) {
         select += "<option value=\"" + i + "\"";
         if( i == selected ) {
            select += " selected=\"selected\"";
         }
         select += ">"+ i + "</option>";
    }
    select += "</select>";

    return select;
} //addNumberSelect( name, number, selected, forEssence )

/******************************** Clock ***************************************/
function init ( )
{
  timeDisplay = document.createTextNode ( "" );
  document.getElementById("clock").appendChild ( timeDisplay );
} //init()

function updateClock ( )
{
  var currentTime = new Date ();

  var currentHours = currentTime.getUTCHours ( );
  var currentMinutes = currentTime.getMinutes ( );
  //var currentSeconds = currentTime.getSeconds ( );

  // Pad the minutes and seconds with leading zeros, if required
  currentMinutes = ( currentMinutes < 10 ? "0" : "" ) + currentMinutes;
  //currentSeconds = ( currentSeconds < 10 ? "0" : "" ) + currentSeconds;

  //Change currentHours from UTC to PST
  if(currentHours<7) {currentHours += 24; } 
  currentHours -= 8;

  // Compose the string for display
  //var currentTimeString = currentHours + ":" + currentMinutes + ":" + currentSeconds;
  var currentTimeString = currentHours + ":" + currentMinutes;

  // Update the time display
  document.getElementById("clock").firstChild.nodeValue = currentTimeString;
} //updateClock()

/****************************** Textlimit *************************************/
function limitText(limitField, limitCount, limitNum) {
	if (limitField.value.length > limitNum) {
		limitField.value = limitField.value.substring(0, limitNum);
	} else {
		limitCount.value = limitNum - limitField.value.length;
	}
}//limitText(limitField, limitCount, limitNum)

/****************************** Dice Roller ***********************************/
function checkForm(theForm) {
    var why = "";
    if (theForm.name.value == "") {
        why += "Name\n";
    }
    if (theForm.action.value == "") {
        why += "Action\n";
    }
    if (theForm.pool.value == "") {
        why += "Dice Pool\n";
    }

    if (why != "") {
        why = "Error: the following values were not filled in:\n" + why;
        alert(why);
        return false;
    }

    if (theForm.pool.value > 40) {
        alert("Error: Dice Pool too large");
        return false;
    }

    return true;
}//checkForm(theForm)