//Initial Settings for the simple counter mechanism to limit the number of options one can add.  Set at two because that's the initial number of options on the screen.
var counter = 2;
var countar = 2;

//Change limit here if you want more options to be able to be displayed.
var limit = 10;
manychoices = new Array("Have a Kip", "Grab a Bite", "Call Someone, Anyone", "Get the Party Started", "Watch a Wee Horror", "Try and Exercise", "Gamble", "Do Some Work", "Play Computer Games", "Relax and Reflect");

//Advanced Javascript ii technique to create the instant tabbed menu using CSS display block / none changes.  Great stuff!
function ShowImage(page, tag)
{
    var i = 1;
    var el;
    while (el = document.getElementById(tag + i)) {
        if (i == page)
            el.style.display = 'block';
        else
            el.style.display = 'none';
        i++;
    }
}

//addset and remove set, clues in the name, well, if 'set' were 'option' that is!
function addSet() {
    var set = document.getElementById('optionform');
    set.appendChild(createSet());
}

function addChoiceSet() {
    var set = document.getElementById('choiceform');
    set.appendChild(createChoiceSet());
}

function removeSet(el) {
    el.parentNode.parentNode.removeChild(el.parentNode);
	counter--;
}

//This was previously addInput in version 2.  But now I'm using more tradtional DOM techniques to generate the additional options.  I **think** this is what allows me to add javascript functions to the additional input.
function createSet() {
	//limit the number of options you can add to the variable 'limit'
     if (counter == limit)  {
          alert("Hey listen, you're not hanged if you're able to conjure up this complex a decision. " + counter + " choices!? I'm pulling you up on this one!");
     }
     else {
	//create all the HTML elements.  Bear in mind that all of this can be done a lot quicker and easier with the innerHTML function.  Need to try and implement that although I reckon the removeOption thing might not work as it's javascript.  Have discussed that with myself extensively elsewhere!
    var div = document.createElement('div');
	var lab = document.createElement('label');
    var cho = document.createElement('input');
	var br1 = document.createElement('br');
	var br2 = document.createElement('br');
    var a = document.createElement('a');
	//set attributes for cho
    cho.type = 'text';
	cho.size = '50';
	//set attributes for a
    a.href = '#';
    a.onclick = function () {
        removeSet(a);
		}
	// now some text for the label element
	sometext = document.createTextNode("Enter Option: ");
	// add the text to the label
	lab.appendChild(sometext);
	// append the label to div, and then start appending the rest of the elements
    div.appendChild(lab);
	div.appendChild(cho)
    div.appendChild(document.createTextNode(' '));
	// add text to 'a' element, same technique as before for 'label'
    a.appendChild(document.createTextNode('Remove'));
    div.appendChild(a);
	div.appendChild(br1);
	div.appendChild(br2);
	counter++;
    return div;
	}
}

function createChoiceSet() {
	//limit the number of options you can add to the variable 'limit'
     if (countar == limit)  {
          alert("Hold Up! There are only" + countar + " options in the list. I reckon you're just pushing the button to see how far it'll go!  If you're having trouble choosing your options then just click 'I just can't be arsed' and let the decision maker take care of everything for you!");
     }
     else {
	//create all the HTML elements.  Bear in mind that all of this can be done a lot quicker and easier with the innerHTML function.  Need to try and implement that although I reckon the removeOption thing might not work as it's javascript.  Have discussed that with myself extensively elsewhere!
    var div = document.createElement('div');
	var lab = document.createElement('label');
	var sel = document.createElement('select');
    var opt1 = document.createElement('option');
    var opt2 = document.createElement('option');
    var opt3 = document.createElement('option');
    var opt4 = document.createElement('option');
    var opt5 = document.createElement('option');
    var opt6 = document.createElement('option');
	var opt7 = document.createElement('option');
	var opt8 = document.createElement('option');
	var opt9 = document.createElement('option');
	var opt10 = document.createElement('option');
	var opt11 = document.createElement('option');
	var br1 = document.createElement('br');
	var br2 = document.createElement('br');
    var a = document.createElement('a');
	//set attributes for a
    a.href = '#';
    a.onclick = function () {
        removeSet(a);
		}
	// now some text for the label element
	sometext = document.createTextNode("Select Option: ");
	// add the text to the label
	lab.appendChild(sometext);
	// append the label to div, and then start appending the rest of the elements
    div.appendChild(lab);
	//create all of the options
	opt1.appendChild(document.createTextNode('Choose One'));
	opt2.appendChild(document.createTextNode('Have a Kip'));
	opt3.appendChild(document.createTextNode('Grab a Bite'));
	opt4.appendChild(document.createTextNode('Call Someone, Anyone'));
	opt5.appendChild(document.createTextNode('Get the Party Started'));
	opt6.appendChild(document.createTextNode('Watch a Wee Horror'));
	opt7.appendChild(document.createTextNode('Try and Exercise'));
	opt8.appendChild(document.createTextNode('Gamble'));
	opt9.appendChild(document.createTextNode('Do Some Work'));
	opt10.appendChild(document.createTextNode('Play Computer Games'));
	opt11.appendChild(document.createTextNode('Relax and Reflect'));
	// now append the options themselves to sel and then append sel itself
	sel.appendChild(opt1);
	sel.appendChild(opt2);
	sel.appendChild(opt3);
	sel.appendChild(opt4);
	sel.appendChild(opt5);
	sel.appendChild(opt6);
	sel.appendChild(opt7);
	sel.appendChild(opt8);
	sel.appendChild(opt9);
	sel.appendChild(opt10);
	sel.appendChild(opt11);
	div.appendChild(sel);
    div.appendChild(document.createTextNode(' '));
	// add text to 'a' element, same technique as before for 'label'
    a.appendChild(document.createTextNode('Remove'));
    div.appendChild(a);
	div.appendChild(br1);
	div.appendChild(br2);
	countar++;
    return div;
	}
}

//In version 2 the length of y was -2 because the 2 buttons were in the div.  That threw me off for a while when this dec maker wasn't working because in this one there are no 'extras' in the form tags.
function processdec(divName, spit){
var x=document.getElementById(divName);
var y=new Array();
for (var i=0;i<x.length;i++)
{
y[i] = x.elements[i].value;
}
var compschoice=Math.floor(Math.random()*(y.length));
document.getElementById(spit).innerHTML = "I reckon you should <b>" + y[compschoice] + "</b>.";
}

function justtellme() {
var compschoice=Math.floor(Math.random()*9);
document.getElementById("spitthrow").innerHTML = "I reckon you should <b>" + manychoices[compschoice] + "</b>.";
}