/* This script and many more are available free online at
The JavaScript Source!! http://javascript.internet.com
Created by: Bobby van der Sluis | http://www.bobbyvandersluis.com/ */
// Details can be found at:
// http://www.bobbyvandersluis.com/articles/unobtrusivedynamicselect.php

// Modified by David Clark to allow another drop box based on the 1st drop box selection

function dynamicSelect(id1, id2, id3) {
 	if (document.getElementById && document.getElementsByTagName) {
  		var sel1 = document.getElementById(id1);
  		var sel2 = document.getElementById(id2);
  		var sel3 = document.getElementById(id3);
  		var clone = sel2.cloneNode(true);
  		var clone2 = sel3.cloneNode(true);
  		var clonedOptions = clone.getElementsByTagName("option");
  		var clonedOptions2 = clone2.getElementsByTagName("option");
  		refreshDynamicSelectOptions(sel1, sel2, sel3, clonedOptions, clonedOptions2);
  		sel1.onchange = function() {
   			refreshDynamicSelectOptions(sel1, sel2, sel3, clonedOptions, clonedOptions2);
  		};
 	}
}

function refreshDynamicSelectOptions(sel1, sel2, sel3, clonedOptions, clonedOptions2) {
 	while (sel2.options.length) {
  		sel2.remove(0);
 	}
 	while (sel3.options.length) {
  		sel3.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)) {
  		 	sel2.appendChild(clonedOptions[i].cloneNode(true));
  		}
 	}
 	for (var i = 0; i < clonedOptions2.length; i++) {
  		if (clonedOptions2[i].className.match(pattern1) || clonedOptions2[i].className.match(pattern2)) {
  		 	sel3.appendChild(clonedOptions2[i].cloneNode(true));
  		}
 	}
}

function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}

addLoadEvent(function() {
dynamicSelect("vinyl", "letterSize", "vinylColours");
});