registerFeature = function (element, featureid, categoryid){
	try{
		element.onmouseover = function(){ };
		element.domRA('onMouseOver');
	}catch(e){ };
	new Feature(element, featureid, categoryid);
};

Feature = Class.create();
Object.extend(Feature.prototype, {

	initialize: function(element, featureid, categoryid){
		this.element = element;
		this.featureid = featureid;
		this.categoryid = categoryid;
		this.focus = true;

		this.eventMouseOver  = this.over.bindAsEventListener(this);
		Event.observe(this.element, "mouseover", this.eventMouseOver);
		this.eventMouseOut   = this.out.bindAsEventListener(this);
		Event.observe(this.element, "mouseout", this.eventMouseOut);

		this.ajax = new Ajax();
		this.ajax.url = XMLProductFeature+'?featureid='+this.featureid;
		this.ajax.caching = true;
		this.ajax.requestXML(function(response){

			var feature = response.responseJSON.products.features.feature;

			this.tooltip = new Tooltip();
			this.tooltip.initTooltip();
			this.tooltip.registerTooltipElement(this.element);

			this.element.setStyle('cursor:help;');

			this.tooltip.registerTooltipTitle(
				domCE('div').domAC(
					domCE('img').domSA({
						src: '/images/gen/feature/'+this.categoryid+'.'+feature['-id']+'.png',
						align: 'left'
					})
				).domAC(
					domCE('h4').setStyle({width: '235px' }).domSA({
						className: 'tooltiptitle'
					}).domCTN(lang(feature.name_en, feature.name_fr))
				)
			);
			this.tooltip.registerTooltipBody(
				domCE('div').domAC(
					domCE('p').setStyle({width: '235px'}).domSA({
						className: 'tooltipbody'
					}).domAC(
						domCE('p').domCHTN(lang(feature.description_en, feature.description_fr))
					)
				)
			);

			if(this.focus) this.tooltip.showTooltip();

			Event.stopObserving(this.element, "mouseover", this.eventMouseOver);
			Event.stopObserving(this.element, "mouseout", this.eventMouseOut);

		}.bind(this));
	},

	over: function(event){
		this.focus = true;
	},

	out: function(event){
		this.focus = false;
	}

});

registerCompat = function (element, compatid, categoryid){
	try{
		element.onmouseover = function(){ };
		element.domRA('onMouseOver');
	}catch(e){ };
	new Compat(element, compatid, categoryid);
};

Compat = Class.create();
Object.extend(Compat.prototype, {

	initialize: function(element, compatid, categoryid, delayRender) {
		this.element = element;
		this.compatid = compatid;
		this.categoryid = categoryid;
		this.delayRender = (delayRender) ? delayRender : false;
		this.focus = true;
		this.rendered = false;

		this.eventMouseOver  = this.over.bindAsEventListener(this);
		Event.observe(this.element, "mouseover", this.eventMouseOver);
		this.eventMouseOut   = this.out.bindAsEventListener(this);
		Event.observe(this.element, "mouseout", this.eventMouseOut);

		if(!delayRender) this.render();

	},

	over: function(event){
		this.focus = true;
		if(!this.rendered) this.render();
	},

	out: function(event){
		this.focus = false;
	},

	render: function(event){
		this.rendered = true;

		this.ajax = new Ajax();
		this.ajax.url = XMLProductCompat+'?compatid='+this.compatid;
		this.ajax.caching = true;
		this.ajax.requestXML(function(response){
			if(typeof response.responseJSON.compat != 'undefined'){
				var compat = response.responseJSON.compat;
				var feature = compat.feature;
				var product = compat.product;
				this.tooltip = new Tooltip();
				this.tooltip.initTooltip();
				this.tooltip.registerTooltipElement(this.element);
				this.element.setStyle('cursor:help;');
				this.tooltip.registerTooltipTitle(
					domCE('div').domAC(
						domCE('h4').setStyle({
							width: '235px',
							maxWidth: '235px'
						}).domSA({
							className: 'tooltiptitle'
						}).domAC(
							domCE('img').domSA({
								src: '/images/gen/feature/'+this.categoryid+'.'+feature['-id']+'.png',
								align: 'left'
							})
						).domAC(
							domCE('p').domAC(
								domCTN(product.partnumber+' '+lang(feature.name_en+' Compatibility', 'Compatibilité '+feature.name_fr))
							)
						)
					)
				);
				this.tooltip.registerTooltipBody(
					domCE('div').domAC(
						domCE('p').setStyle({
							width: '235px',
							maxWidth: '235px'
						}).domSA({
							className: 'tooltipbody'
						}).domAC(
							this.tooltipBody = domCE('div').domAC(
								domCE('p').domAC(
									domCE('span').domCHTN(lang(feature.description_en, feature.description_fr)+' '+lang('Compatible with all versions of the ','Compatible avec toutes les versions du ')+compat.product.partnumber+'.')
								)
							)
						)
					)
				);
				if(lang(compat.notes_en, compat.notes_fr)){
					this.tooltipBody.domRCN();
					this.tooltipBody.domAC(
						domCE('p').domAC(
							domCE('span').domCHTN(lang(feature.description_en, feature.description_fr)+' ')
						).domAC(
							domCE('span').setStyle({
								color: 'Red'
							}).domCHTN(lang(compat.notes_en, compat.notes_fr))
						)
					);
				};
				if(typeof(compat.platform) != 'undefined'
					&& typeof(compat.platform.hardware) != 'undefined'
					&& typeof(compat.platform.hardware.firmware) != 'undefined'
				){
					var platform = compat.platform;
					var hardware = platform.hardware;
					var firmware = hardware.firmware;
					this.tooltipBody.domRCN(
						domCE('p').domAC(
							domCE('span').domCHTN(lang(feature.description_en, feature.description_fr)+' ')
						).domAC(
							domCE('span').setStyle({
								color: 'Red'
							}).domCHTN(lang('Compatible with firmware version <strong>'+hardware['-version']+'.'+firmware['-version']+'</strong> of the ','Compatible avec la version <strong>'+hardware['-version']+'.'+firmware['-version']+'</strong> du logiciel du ')+compat.product.partnumber+'.')
						)
					);
				};
				if(this.focus) this.tooltip.showTooltip();
				Event.stopObserving(this.element, "mouseover", this.eventMouseOver);
				Event.stopObserving(this.element, "mouseout", this.eventMouseOut);
			};
		}.bind(this));
	}
});

registerFile = function (element, fileid){
	try{
		element.onmouseover = function(){ };
		element.domRA('onMouseOver');
	}catch(e){ };
	new File(element, fileid);
};

File = Class.create();
Object.extend(File.prototype, {

	initialize: function(element, fileid, delayRender) {
		this.element = element;
		this.fileid = fileid;
		this.delayRender = (delayRender) ? delayRender : false;
		this.focus = true;
		this.rendered = false;

		this.eventMouseOver  = this.over.bindAsEventListener(this);
		Event.observe(this.element, "mouseover", this.eventMouseOver);
		this.eventMouseOut   = this.out.bindAsEventListener(this);
		Event.observe(this.element, "mouseout", this.eventMouseOut);

		if(!delayRender) this.render();
	},

	over: function(event){
		this.focus = true;
		if(!this.rendered) this.render();
	},

	out: function(event){
		this.focus = false;
	},

	render: function(event){
		this.rendered = true;

		this.ajax = new Ajax();
		this.ajax.url = XMLFile+'?fileid='+this.fileid;
		this.ajax.caching = true;
		this.ajax.requestXML(function(response){

			var category = response.responseJSON.files.category;
			var file = category.file;

			this.tooltip = new Tooltip();
			this.tooltip.initTooltip();
			this.tooltip.registerTooltipElement(this.element);

			this.element.setStyle('cursor:help;');

			this.tooltip.registerTooltipTitle(
				domCE('div').domAC(
					domCE('img').domSA({
						src: '/images/extensions/'+file.extension+'.png',
						align: 'left'
					})
				).domAC(
					domCE('h4').setStyle({width: '235px' }).domSA({
						className: 'tooltiptitle'
					}).domAC(
						domCE('p').domAC(
							domCTN(lang('Download File','Téléchargement de Fichier'))
						)
					)
				)
			);

			this.tooltip.registerTooltipBody(
				domCE('div').domAC(
					domCE('p').setStyle({width: '235px'}).domSA({
						className: 'tooltipbody'
					}).domAC(
						this.tooltipBody = domCE('p')
					)
				)
			);

			this.tooltipBody.domAC(
				domCE('h2').domCHTN(file.size.humanbytes())
			);

			if(lang(category.description_en, category.description_fr)){
				this.tooltipBody.domAC(
					domCE('p').domCHTN(lang(category.description_en, category.description_fr).nl2br())
				);
			};

			if(lang(file.description_en, file.description_fr)){
				this.tooltipBody.domAC(
					domCE('p').domCHTN(lang(file.description_en, file.description_fr).nl2br())
				);
			};

			this.tooltipBody.domAC(
				domCE('br')
			).domAC(
				domCE('p').setStyle({
					color: '#ff0000',
					fontStyle: 'italic'
				}).domSA({
					align: 'center'
				}).domCTN(lang('Click to download','Cliquez pour télécharger'))
			);

			if(this.focus) this.tooltip.showTooltip();

			Event.stopObserving(this.element, "mouseover", this.eventMouseOver);
			Event.stopObserving(this.element, "mouseout", this.eventMouseOut);

		}.bind(this));
	}
});

registerProduct = function (element, productid){
	try{
		element.onmouseover = function(){ };
		element.domRA('onMouseOver');
	}catch(e){ };
	new Product(element, productid);
};

Product = Class.create();
Object.extend(Product.prototype, {

	initialize: function(element, productid) {
		this.element = element;
		this.productid = productid;
		this.focus = true;

		this.eventMouseOver  = this.over.bindAsEventListener(this);
		Event.observe(this.element, "mouseover", this.eventMouseOver);
		this.eventMouseOut   = this.out.bindAsEventListener(this);
		Event.observe(this.element, "mouseout", this.eventMouseOut);

		this.ajax = new Ajax();
		this.ajax.url = XMLProduct+'?productid='+this.productid;
		this.ajax.caching = true;
		this.ajax.requestXML(function(response){
			var product = response.responseJSON.products.product;

			this.tooltip = new Tooltip();
			this.tooltip.initTooltip();
			this.tooltip.registerTooltipElement(this.element);

			this.element.setStyle('cursor:help;');

			this.tooltip.registerTooltipTitle(
				domCE('div').domAC(
					domCE('h4').setStyle({
						width: '235px',
						maxWidth: '235px'
					}).domSA({
						className: 'tooltiptitle',
						align: 'center'
					}).domAC(
						domCE('p').domAC(
							domCTN(product.partnumber)
						)
					)
				)
			);

			this.tooltip.registerTooltipBody(
				domCE('div').domAC(
					domCE('div').setStyle({
						width: '225px',
						maxWidth: '225px',
						padding: '5px'
					}).domSA({
						className: 'tooltipbody'
					}).domAC(
						this.elementAvailability = domCE('div').domSA({
							align: 'center'
						}).setStyle({
							fontSize: '8pt'
						})
					)
				).domAC(
					domCE('p').setStyle({
						width: '235px',
						maxWidth: '235px'
					}).domSA({
						className: 'tooltipbody'
					}).domAC(
						domCE('img').domSA({
							src: product.thumb,
							align: 'left',
							width: '50'
						})
					).domAC(
						domCE('p').domSA({
							style: 'font-weight:bold;'
						}).domCHTN(lang(product.name_en, product.name_fr))
					).domAC(
						domCE('p').domCHTN(lang(product.shortdescription_en, product.shortdescription_fr))
					).domAC(
						domCE('br')
					).domAC(
						domCE('p').setStyle({
							color: '#ff0000',
							fontStyle: 'italic'
						}).domSA({
							align: 'center'
						}).domCTN(lang('Click for more information','Cliquez pour plus d\'information'))
					)
				)
			);

			switch(product.availability){
				case 'local':
				case 'distributor':
					this.elementAvailability.domSA({
						className:'local'
					}).domCTN(lang('The '+product.partnumber+' is available.','Le '+product.partnumber+' est disponible.'))
					break;
				case 'deprecate':
					this.elementAvailability.domSA({
						className:'deprecate'
					}).domCTN(lang('The '+product.partnumber+' is in final clearance.','Le '+product.partnumber+' est en vente finale.'))
					break;
				case 'discontinued':
					this.elementAvailability.domSA({
						className:'discontinued'
					}).domCTN(lang('The '+product.partnumber+' is no longer available.','Le '+product.partnumber+' n\'est plus disponible.'))
					break;
				default:
					this.elementAvailability.hide();
			};

			if(this.focus) this.tooltip.showTooltip();

			Event.stopObserving(this.element, "mouseover", this.eventMouseOver);
			Event.stopObserving(this.element, "mouseout", this.eventMouseOut);

		}.bind(this));
	},

	over: function(event){
		this.focus = true;
	},

	out: function(event){
		this.focus = false;
	}
});


registerMake = function(element, makeid){
	try{
		element.onmouseover = function(){ };
		element.domRA('onMouseOver');
	}catch(e){ };
	new Make(element, makeid);
};

Make = Class.create();
Object.extend(Make.prototype, {

	initialize: function(element, makeid){
		this.element = element;
		this.makeid = makeid;
		this.focus = true;
		this.eventMouseOver  = this.over.bindAsEventListener(this);
		Event.observe(this.element, "mouseover", this.eventMouseOver);
		this.eventMouseOut   = this.out.bindAsEventListener(this);
		Event.observe(this.element, "mouseout", this.eventMouseOut);
		this.ajax = new Ajax();
		this.ajax.url = XMLVehicleMake+'?makeid='+this.makeid;
		this.ajax.caching = true;
		this.ajax.requestXML(function(response){
			if(typeof response.responseJSON.vehicles != 'undefined'){
				var make = response.responseJSON.vehicles.make;
				this.tooltip = new Tooltip();
				this.tooltip.initTooltip();
				this.tooltip.registerTooltipElement(this.element);
				this.element.setStyle('cursor:help;');
				this.tooltip.registerTooltipTitle(
					domCE('div').domAC(
						domCE('h4').setStyle({width: '235px' }).domSA({
							className: 'tooltiptitle'
						}).domCTN(make.name+' Compatability')
					)
				);
				this.tooltip.registerTooltipBody(
					domCE('div').domAC(
						domCE('p').setStyle({width: '235px'}).domSA({
							className: 'tooltipbody'
						}).domAC(
							domCE('div').domSA({
								align: 'center'
							}).domAC(
								domCE('img').domSA({
									src: make.image
								})
							)
						).domAC(
							domCE('div').domSA({
								align: 'center'
							}).domAC(
								domCE('p').domCTN('Click to view this new vehicle.')
							)
						)
					)
				);
				if(this.focus) this.tooltip.showTooltip();
				Event.stopObserving(this.element, "mouseover", this.eventMouseOver);
				Event.stopObserving(this.element, "mouseout", this.eventMouseOut);
			};
		}.bind(this));

	},

	over: function(event){
		this.focus = true;
	},

	out: function(event){
		this.focus = false;
	}

});


registerProductVehicle = function (element, productid, vehicleid, producturl){
	try{
		element.domRA('onMouseOver');
	}catch(e){ };
	//prevent dups from race condition
	if(!element.hasClassName('ol')){
		element.addClassName('ol');
		new Product(element, productid);
		new ProductVehicle(element, productid, vehicleid, producturl);
	};
};

ProductVehicle = Class.create();
Object.extend(ProductVehicle.prototype, {

	initialize: function(element, productid, vehicleid, producturl) {
		this.element = element;
		this.productid = productid;
		this.vehicleid = vehicleid;
		this.producturl = (producturl) ? producturl : false ;
		this.rendered = false;
		this.notes = Array();
		this.eventMouseDown  = this.showOverlay.bindAsEventListener(this);
		Event.observe(this.element, "mousedown", this.eventMouseDown);
	},

	renderOverlay: function(event){
		this.elementOverlay = domCE('div').setStyle({
			position: 'relative'
		}).domSA({
			className: 'overlay'
		}).domAC(
			this.elementClose = domCE('img').setStyle({
				position: 'absolute',
				left: '502px',
				top: '-8px',
				cursor: 'pointer',
				zIndex: 5
			}).domSA({
				src: ((pngBug) ? '/images/overlay_close.gif' : '/images/overlay_close.png'),
				height: '46px',
				width: '40px'
			})
		).domAC(
			this.elementHeader = domCE('div').domSA({
				className: 'head'
			}).domAC(
				domCE('h1').domCTN(lang('Product Compatibility','Compatibilité du Produit'))
			)
		).domAC(
			this.elementBody = domCE('div').setStyle({
				position: 'relative'
			}).domSA({
				className: 'body'
			}).domAC(
				domCE('div').setStyle({
					height: '300px'
				})
			).domAC(
				domCE('img').setStyle({
					position: 'absolute',
					left: '250px',
					top: '135px'
				}).domSA({
					src: '/images/loadinglarge.gif',
					height: '48px',
					width: '48px'
				})
			)
		).domAC(
			this.elementFooter = domCE('div').domSA({
				className: 'foot'
			}).domAC(
				domCE('img').domSA({
					src: '/images/spacer.gif',
					width: '10px',
					height: '10px'
				})
			).domCTN(lang('Click anywhere outside this window to close.','Cliquez à l\'extérieur de cette fenêtre pour fermer'))
		);

		this.overlay = new Overlay({ width: 550, reposition: false });
		this.overlay.registerOverlay(this.elementOverlay);
		this.overlay.showOverlay();

		this.eventClose  = this.hideOverlay.bindAsEventListener(this);
		Event.observe(this.elementClose, "mousedown", this.eventClose);

		this.ajax = new Ajax();
		this.ajax.url = XMLProductVehicle+'?productid='+this.productid+'&vehicleid='+this.vehicleid;
		this.ajax.caching = true;
		this.ajax.requestXML(function(response){
			if(typeof response.responseJSON == 'undefined') return;
			if(typeof response.responseJSON.products == 'undefined') return;
			if(typeof response.responseJSON.products.product == 'undefined') return;

			this.product = response.responseJSON.products.product;
			this.make = this.product.vehicles.make;
			this.model = this.make.model;
			this.year = this.model.year;
			this.vehicle = this.year.vehicle;
			this.vehicle.features.feature = (typeof this.vehicle.features.feature.length == 'undefined')
				? [this.vehicle.features.feature]
				: this.vehicle.features.feature;
			this.vehicle.features.feature.sort(function(a,b){
				return (lang(a.name_en, a.name_fr) > lang(b.name_en, b.name_fr)) ? 1 : -1;
			});

			this.elementBody.domRCN();
			this.elementBody.domAC(
				this.elementTable = domCE('table').setStyle({
					width: '525px'
				}).domSA({
					className: 'wizardtable',
					border: '0',
					cellSpacing: '0',
					cellPadding: '0'
				}).domAC(
					this.elementTbody = domCE('tbody').domAC(
						domCE('tr').domSA({
							className: 'images'
						}).domAC(
							domCE('td').domSA({
								className: 'left'
							}).domAC(
								domCE('img').domSA({
									src: '/images/gen/make/'+this.make['-id']+'.png',
									height: '120',
									width: '120'
								})
							)
						).domAC(
							domCE('td').domSA({
								className: 'right'
							}).domAC(
								domCE('img').domSA({
									src: this.product.thumb,
									width: '100'
								})
							)
						)
					).domAC(
						domCE('tr').domSA({
							className: 'head'
						}).domAC(
							domCE('td').domSA({
								className: 'left'
							}).domAC(
								domCE('h4').domCTN(this.make['-make']+' '+this.model['-model']+' '+this.year['-year'])
							)
						).domAC(
							domCE('td').domSA({
								className: 'right'
							}).domAC(
								domCE('h4').domCTN(this.product.partnumber)
							)
						)
					)
				)
			).domAC(
				this.elementNotes = domCE('div').setStyle({
					width: '525px'
				}).domSA({
					className: 'wizardnotes'
				}).domAC(
					domCE('h4').domSA({
						className: 'subtitle'
					}).domCTN(lang('Compatability Notes','Notes Sur La Compatibilité'))
				).hide()
			).domAC(
				this.elementFiles = domCE('div').setStyle({
					width: '525px'
				}).domSA({
					className: 'wizardfiles'
				}).domAC(
					domCE('h4').domSA({
						className: 'subtitle'
					}).domCTN(lang('Installation Guides','Guides D\'Installation'))
				).hide()

			);

			this.vehicle.features.feature.each(function(feature, index){
				elementVersion = domCE('p');
				if(lang(feature.notes_en, feature.notes_fr)){
					elementVersion.domAC(
						domCE('strong').domSA({
							className: 'note'
						}).domCTN('['+(this.addNote(lang(feature.notes_en, feature.notes_fr))+1)+']\u00a0')
					);
				};
				if(typeof feature.platform != 'undefined'){
					this.platform = feature.platform;
					this.hardware = this.platform.hardware;
					this.firmware = this.hardware.firmware;
					elementVersion.domAC(
						domCE('font').domSA({
							className: 'h_col'
						}).domCTN(this.hardware['-version']+'.')
					).domAC(
						domCE('font').domSA({
							className: 'f_col'
						}).domCTN(this.firmware['-version'])
					)
				}else{
					elementVersion.domAC(
						domCE('img').domSA({
							src: '/images/checkmark.gif',
							width: '15',
							height: '12',
							alt: 'Compatible'
						})
					);
				};
				this.elementTbody.domAC(
					row = domCE('tr').domSA({
						className: 'compat row'+(index%2)
					}).domAC(
						domCE('td').domSA({
							className: 'left'
						}).domAC(
							domCTN(lang(feature.name_en,feature.name_fr))
						)
					).domAC(
						domCE('td').domSA({
							className: 'right'
						}).domAC(
							elementVersion
						)
					)
				);
				new Compat(row, feature['-compatid'], 0, true);
			}.bind(this));

			if(this.producturl){
				this.elementTbody.domAC(
					domCE('tr').domAC(
						domCE('td').domSA({
							className: 'left'
						}).domAC(
							domCTN('\u00a0')
						)
					).domAC(
						domCE('td').domSA({
							className: 'right'
						}).domAC(
							this.elementButton = domCE('button').domCHTN(lang('More Information','Plus d\'Information ')+' <strong>&gt;&gt;</strong>')
						)
					)
				);
				this.eventGotoProduct  = this.gotoProduct.bindAsEventListener(this);
				Event.observe(this.elementButton, "mousedown", this.eventGotoProduct);

			};

			if(typeof this.product.files != 'undefined'){
				this.files = this.product.files;
				this.files.category = (typeof this.files.category.length == 'undefined')
					? [this.files.category]
					: this.files.category;
				this.files.category.each(function(category){
					category.file = (typeof category.file.length == 'undefined')
						? [category.file]
						: category.file;
					category.file.each(function(file, index){
						this.elementFiles.show();
						this.elementFiles.domAC(
							domCE('p').domSA({
								className: 'file row'+(index%2)
							}).domAC(
								row = domCE('a').domSA({
									href: lang('/download/'+file['-id']+'/'+file.name_en.cleanurl(),'/download/'+file['-id']+'/'+file.name_fr.cleanurl())+'.rev-'+file.revision+'.'+file.extension,
									target: '_blank'
								}).domAC(
									domCE('img').domSA({
										src: '/images/extensions/'+file.extension+'.png',
										height: '26',
										width: '24',
										border: '0'
									})
								).domAC(
									domCTN('\u00a0'+lang(file.name_en, file.name_fr))
								)
							)
						);
						new File(row, file['-id'], true);
					}.bind(this));
				}.bind(this));
			};
			this.overlay.positionOverlay();
		}.bind(this));
		this.rendered = true;
	},

	showOverlay: function(event){
		try{ if(event && typeof(Event.stop) == 'function') Event.stop(event); }catch(e){};
		if(!this.rendered){
			this.renderOverlay();
		}else{
			this.overlay.showOverlay();
		};
	},

	hideOverlay: function(event){
		if(!this.rendered) return;
		this.overlay.hideOverlay();
	},

	addNote: function(note){
		for(var i=0; i<=this.notes.length; i++){
			if(this.notes[i] == note) return i;
		};
		var pointer = this.notes.length
		this.notes[pointer] = note;
		this.elementNotes.show();
		this.elementNotes.domAC(
			domCE('p').domSA({
				className: 'note row'+(pointer%2)
			}).domAC(
				domCE('strong').domCTN('\u00a0['+(pointer+1)+']')
			).domAC(
				domCTN('\u00a0'+note)
			)
		);
		return pointer;
	},

	gotoProduct: function(event){
		window.location.href = this.producturl;
	}

});
