// document.write won't work for XHTML mime type
// To be constructed *before* domready in head

var CB = new Class({
	Implements: [Options],
	
	options: {
		boxes: '.cbb',
		cssFile: ""
	},
	
	initialize: function(options) {
		this.setOptions(options)
		
		var firefox3 = Browser.Engine.gecko && Browser.Engine.version >= 19;
		var safari3 = Browser.Engine.webkit && Browser.Engine.version >= 525;

		(firefox3 || safari3) ? this.nat() : this.nonNat();
	},
	
	nat: function() {
		document.write('<link rel=\"stylesheet\" type=\"text/css\" href=\"'+this.options.cssFile+'\" media=\"screen\">');	
	},
	
	nonNat: function() {
		window.addEvent('domready', function() {
			boxes = $$(this.options.boxes);
			boxes.each(function(originalDiv, i) {
				/* Save original class/ids */
				var originalClassName = originalDiv.getProperty('class');
				var originalID = originalDiv.getProperty('id');

				/* Create new nodes */
				var div1 = new Element('div');
				var div2 = new Element('div');
				var div3 = new Element('div');

				/* Transfer original class/ids to external div, but cbb->cb */
				div1.setProperty('class', originalClassName);
				div1.setProperty('id', originalID);
				div1.removeClass('cbb');
				div1.addClass('cb');

				/* Set ids/class of elements */
				div2.setProperty('class', 'i1');
				div3.setProperty('class', 'i2');

				/* Put new divs into document */
				div3.inject(div2);
				div2.inject(div1);
				div1.inject(originalDiv,'before');

				/* Put original div into inner-most new div */
				originalDiv.setProperty('class', 'i3');
				originalDiv.removeProperty('id');
				originalDiv.inject(div3);
			}.bind(this));			
		}.bind(this));
	}
});
