/***************************************
 * Rainebrooke Product Select Script 
 * (c) 2006 Rainebrooke Designs      
 * Written by:  Eric Hamilton
 * dilvie at dilvie.com
 * 
 * Portions of this code rely on the
 * Behaviour.js library.  It is used
 * to abstract behaviors from markup.
 * The Behaviour library is distributed
 * under the terms of the BSD license.
 * It must be included with a script
 * tag for this code to function.
 * 
 * Portions of this code also rely on
 * selectOptionIndexByValue, which is
 * (c) Eric Hamilton, 2005 2006,
 * included in this file for convenience.
 ***************************************/

RB = new Object(); // Project scope objects -- protects page from namespace collisions if future scripts are introduced.
RB.products = new Array(); // Name-protected storage for product objects

/** Do not modify above this point **/
RB.displayElementId = 'RB_Preview'; // ID of image element to use for preview
RB.selectElementId = 'Product_Code'; // ID of product select element -- remember to change in RB.Behaviors

/* Add products here: ****************
 * This section serves multiple functions:
 * * It creates a master index of products that allows you to select by product 
 *   code (ie myProduct = RB.products['sl_lightpink'];).
 * * It makes it really easy to fetch information about the product, such as the image URL:
 *   imageURL = RB.products['sl_hotpink'].image.src;
 * * It preloads images, so that the user doesn't have to wait for the browser to fetch
 *   an image when they go to preview product options.
 *************************************/

RB.code = ''; // This line declares a temporary variable that stores the product code in order
              // to pack it into the associative array index, and the product object.

RB.code = 'nz_tus_pink'; // Set code for this product -- this variable is re-used for subsequent products
RB.products[RB.code] = new RB_Product(RB.code); // Create product object and add it to the RB.products array
RB.products[RB.code].image = new Image (250, 264); // Create product image object, with pixel dimensions
RB.products[RB.code].image.src = 'http://www.rainebrooke.com/images/products/tuscany_pink_250x264.jpg'; // assign image url

RB.code = 'nz_tus_red';
RB.products[RB.code] = new RB_Product(RB.code);
RB.products[RB.code].image = new Image (250, 260);
RB.products[RB.code].image.src = 'http://www.rainebrooke.com/images/products/tuscany_red_250x260.jpg';

RB.code = 'nz_tus_green';
RB.products[RB.code] = new RB_Product(RB.code);
RB.products[RB.code].image = new Image (250, 262);
RB.products[RB.code].image.src = 'http://www.rainebrooke.com/images/products/tuscany_green_250x262.jpg';

RB.code = 'nz_tus_tan';
RB.products[RB.code] = new RB_Product(RB.code);
RB.products[RB.code].image = new Image (250, 269);
RB.products[RB.code].image.src = 'http://www.rainebrooke.com/images/products/tuscany_tan_250x269.jpg';



// Assign behaviors:

RB.behaviors = {
	'.swatch' : function(element) {
		element.onclick = RB.swatchClicked;
	},
	'#Product_Code' : function(element) {
		element.onchange = RB.selectionChanged;
	}
	
}
Behaviour.register(RB.behaviors);

RB.swatchClicked = function() {
  var code = this.id;
  RB.updateDisplay(code);
  RB.updateSelect(code);
  return(false);
}

RB.selectionChanged = function() {
  var code = this.options[this.selectedIndex].value;
  RB.updateDisplay(code);
}

RB.updateDisplay = function(code) {
  var displayElement = document.getElementById(RB.displayElementId);
  if (RB.products[code]) {
	var imgURL = RB.products[code].image.src;
        displayElement.src = imgURL;
  }
}

RB.updateSelect = function(code) {
  var selectElement = document.getElementById(RB.selectElementId);
  selectElement.selectedIndex = selectOptionIndexByValue(RB.selectElementId, code);
}

function RB_Product() {
  this.code ='';
  this.image = '';
}

function selectOptionIndexByValue(elementId, value) {
  var element = document.getElementById(elementId);
  var value = new RegExp(value);
  for (var i=0; i<element.options.length; i++) {
	if (element.options[i].value.match(value)) {
		return(i);
	}
  }
  return(false);
}