/* bundlua @ 2008-07-14 00:11:44 */

/* --- beatbox.js --- */
// BB1.23 :: BeatBox
//***************************************************************************
// DOM scripting by brothercake -- http://www.brothercake.com/
// Design consultant Andrew Krespanis -- http://leftjustified.net/
// GNU Lesser General Public License -- http://www.gnu.org/licenses/lgpl.html
//***************************************************************************

//###########################################################################
//    >>> THIS SCRIPT MUST BE PLACED AT THE END OF THE BODY SECTION <<<
//###########################################################################

//instantiate the beatbox object with a paramters
new BeatBox(
		'0.7',		//max image size (as proportion of available space)
		'.thumb'	//thumbnail extension value
		);

//***************************************************************************
//***************************************************************************





//object constructor
function BeatBox(maxsize, thumbex)
{
    //weed out unsupported browsers
	if(typeof document.getElementById == 'undefined' || typeof document.createElement == 'undefined') { return; }

	//parse and save the max image width if it's defined
	//otherwise use a default value 0.5
	this.maxsize = parseFloat(maxsize);

	//save the thumbnail extension if it's defined
	//otherwise use an empty string
	this.thumbex = typeof thumbex != 'undefined' ? thumbex : '';

	//specify groups that need behavioral tweaks
	this.isie = typeof document.uniqueID != 'undefined';
	this.quirksmode = (this.isie || typeof window.opera != 'undefined') && (typeof document.compatMode == 'undefined' || document.compatMode != 'CSS1Compat');
	this.isgecko = navigator.product == 'Gecko' && navigator.vendor != 'Apple Computer, Inc.' && navigator.vendor != 'KDE';
	//iframe shim is for firefox (so it covers flash) and IE6 (to cover select elements and flash)
	this.needsiframeshim = this.isgecko || (typeof document.uniqueID != 'undefined' && typeof window.XMLHttpRequest == 'undefined');

	//create some objects we'll need
	this.body = document.getElementsByTagName('body')[0];
	this.screen = null;
	this.window = null;
	this.iframe = null;

	//array of beatbox links
	this.links = [];
    this.linkTypes = [];

    //iterate through all links, and store all those
	//which have the "beatbox" class name
	//and which point to an image file
	var links = document.getElementsByTagName('a');
	for(var i=0; i<links.length; i++)
	{
		if ((links[i].className && links[i].className.indexOf('beatbox_inner') != -1)){
            this.links[this.links.length] = links[i];
            this.linkTypes[this.linkTypes.length] = "inner"
        }else if((links[i].className && links[i].className.indexOf('beatbox') != -1)
			/*&& (links[i].href && /\.(jpg|jpeg|gif|png|mng|apng|bmp|tif|tiff)$/i.test(links[i].href))*/)
		{
			this.links[this.links.length] = links[i];
            this.linkTypes[this.linkTypes.length] = "outer"
        }
    }

	//create a reference to this for inner functions
	var self = this;

	//then for each stored link
	for(i=0; i<this.links.length; i++)
	{
        //bind an onclick handler, which has to be a handler not a listener
		//so that we can cancel the default action
		//(for a listener that wouldn't work in safari)
		if (this.linkTypes[i] == "outer"){
            this.links[i].onclick = function()
            {
                //if we already have the loading screen, remove it
                //this will only be relevant if you get tired of waiting for an image to load
                //or if something else goes wrong somewhere
                if(self.screen)
                {
                    self.removeLoadingScreen();
                }

                //otherwise we're good
                else
                {
                    //put up the loading screen
                    self.showLoadingScreen();

                    //save a reference to this link
                    //to pass into the show image window function
                    var link = this;
                    self.showImageWindow(link);
                }

                //cancel the default action of the link
                return false;
            };
        }else if (this.linkTypes[i] == "inner"){
            this.links[i].onclick = function()
            {
                //if we already have the loading screen, remove it
                //this will only be relevant if you get tired of waiting for an image to load
                //or if something else goes wrong somewhere
                if(self.screen)
                {
                    self.removeLoadingScreen();
                }

                //otherwise we're good
                else
                {
                    //put up the loading screen
                    self.showLoadingScreen();

                    //save a reference to this link
                    //to pass into the show image window function
                    var link = this;
                    self.showInnerWindow(link);
                }

                //cancel the default action of the link
                return false;
            };
        }

	}
}

//show the loading screen
BeatBox.prototype.showLoadingScreen = function()
{
	//ignore this if the loading screen is present already
	if(this.screen) { return; }

	//create the loading screen element
	this.screen = document.createElement('div');
	this.screen.id = 'beatbox-loadingscreen';
	this.screen.appendChild(document.createTextNode('Loading image ...'));

	//append it to the page
	this.body.appendChild(this.screen);

	//get the canvas size and scrolling offset
	var canvas = this.getCanvasSize();
	var scrolling = this.getScrollingOffset();

	//size the loading screen to fit the canvas, and apply padding to position the text
	this.screen.style.width = canvas.width + 'px';
	this.screen.style.paddingTop = (canvas.height / 2) + 'px';
	this.screen.style.height = ((canvas.height + document.body.offsetHeight) / (this.quirksmode && this.isie ? 1 : 2)) + 'px';

	//position the loading screen, accounting for scrolling offset
	this.screen.style.left = 0 + 'px';
	this.screen.style.top = 0 + 'px';

	//bind a click handler to the loading screen
	//that removes it, and the image window if present
	var self = this;
	this.screen.onclick = function()
	{
		self.removeImageWindow();
		self.removeLoadingScreen();
	};

	//make it visible
	this.screen.style.visibility = 'visible';
};

//remove the loading screen
BeatBox.prototype.removeLoadingScreen = function()
{
	//ignore this if the loading screen is not present
	if(!this.screen) { return; }

	//remove the screen and nullify the reference
	this.screen.parentNode.removeChild(this.screen);
	this.screen = null;
};

//show the image window
BeatBox.prototype.showImageWindow = function(link)
{
	//ignore this if the image window is present already
	if(this.window) { return; }
	//create the image window element
	this.window = document.createElement('div');
	this.window.id = 'beatbox-imagewindow';
	//get the canvas size and scrolling offset
	var canvas = this.getCanvasSize();
	var scrolling = this.getScrollingOffset();
	var imgwidth = 400;
	var docFrame = document.createElement("IFRAME");
   	docFrame.setAttribute("src", link);
   	docFrame.style.width = 400+"px";
   	docFrame.style.height = 300+"px";
   	docFrame.setAttribute("frameBorder", "0");
	this.window.appendChild(docFrame);
	//create the controls
    /*
    var controls = document.createElement('ul');
	li = controls.appendChild(document.createElement('li'));
	li.className = 'close';
	var close = li.appendChild(document.createElement('a'));
	close.setAttribute('href', 'javascript:void("Close the image window")');
	close.setAttribute('title', 'Close the image window');
	close.appendChild(document.createTextNode('Close'));
	*/
	//append them to the image window
	this.window.appendChild(controls);
	
	//bind a handlers to the close link
	//to remove the loading screen and image window
	//and set focus back on the original link
	var self = this;
    /*
    close.onclick = function()
	{
		self.removeImageWindow();
		self.removeLoadingScreen();
		link.focus();
	};
    */
	//append the image window to the page
	this.body.appendChild(this.window);
	//IE needs some silly style hacks,
	//but they break other browsers
	if(this.isie)
	{
		controls.style.width = imgwidth + 'px';
		if(controls.offsetWidth < 200)
		{
			controls.style.width = '200px';
		}
	}

	//now position it in the center using its rendered size to calculate
	//and accounting for scrolling offset
	this.window.style.left = (((canvas.width - this.window.offsetWidth) / 2) + scrolling.left) + 'px';
	this.window.style.top = (((canvas.height - this.window.offsetHeight) / 2) + scrolling.top) + 'px';

	//hide the loading animation in the loading screen and remove the text
	this.screen.style.backgroundImage = 'none';
	this.screen.removeChild(this.screen.firstChild);

	//create an iframe shim beneath the image window
	this.showIframeShim();

	//make the window visible
	this.window.style.visibility = 'visible';

	//set focus on the image link
	//imglink.focus();
};

BeatBox.prototype.showInnerWindow = function(link)
{
	//ignore this if the image window is present already
	if(this.window) { return; }
    //create the image window element
	this.window = document.createElement('div');
    this.window.id = 'beatbox-imagewindow';
    //create the controls
    var control = document.createElement('div');
    var close = control.appendChild(document.createElement('a'))
    close.href = "javascript:void(0);";
    control.appendChild(document.createElement('br'));
    control.appendChild(document.createElement('br'));
    close.className = 'modal-dialog-close';
    close.appendChild(document.createTextNode('Close [X]'));
    this.window.appendChild(control);
    var content = document.createElement('div');
    content.id = 'modal-content';
    content.className = 'beatbox-inner';
    this.window.appendChild(content);
    //get the canvas size and scrolling offset
	var canvas = this.getCanvasSize();
	var scrolling = this.getScrollingOffset();
	var imgwidth = 400;
    var url = new String(link);
    var urls = [];
    urls = url.split("/");
    var modalData = document.getElementById(urls[urls.length-1]);
    content.innerHTML = modalData.innerHTML;


    /*
    var controls = document.createElement('ul');
	li = controls.appendChild(document.createElement('li'));
    li.className = 'close';
	var close = li.appendChild(document.createElement('a'));
	close.setAttribute('href', 'javascript:void("Close the image window")');
	close.setAttribute('title', 'Close the image window');
	close.appendChild(document.createTextNode('Close'));
    */
	//append them to the image window
	//this.window.appendChild(controls);

	//bind a handlers to the close link
	//to remove the loading screen and image window
	//and set focus back on the original link
	var self = this;

    close.onclick = function()
	{
		self.removeImageWindow();
		self.removeLoadingScreen();
		link.focus();
	};
	//append the image window to the page
	this.body.appendChild(this.window);
	control.style.width = 10 + 'px';
	control.style.width = this.window.offsetWidth + 'px';
	//now position it in the center using its rendered size to calculate
	//and accounting for scrolling offset
	this.window.style.left = (((canvas.width - this.window.offsetWidth) / 2) + scrolling.left) + 'px';
    this.window.style.top = (((canvas.height - this.window.offsetHeight) / 2) + scrolling.top) + 'px';

	//hide the loading animation in the loading screen and remove the text
	this.screen.style.backgroundImage = 'none';
	this.screen.removeChild(this.screen.firstChild);

	//create an iframe shim beneath the image window
	this.showIframeShim();

	//make the window visible
	this.window.style.visibility = 'visible';

	//set focus on the image link
	//imglink.focus();
};

//remove the image window
BeatBox.prototype.removeImageWindow = function()
{
	//ignore this if the image window is not present
	if(!this.window) { return; }

	//remove the window and nullify the reference
	this.window.parentNode.removeChild(this.window);
	this.window = null;

	//remove the iframe shim
	this.removeIframeShim();
};


//create an iframe shim to cover windowed controls in IE5.5 and IE6
BeatBox.prototype.showIframeShim = function()
{
	//ignore this if we're not a browser that needs the iframe shim
	//or if we don't have an image window
	//or if we already have an iframe shim
	if(!this.needsiframeshim || !this.window || this.iframe) { return; }

	//create an iframe
	this.iframe = document.createElement('iframe');
	this.iframe.id = 'beatbox-iframeshim';

	//the javascript src prevents IE from trying to load a page
	//and hence avoids the "secure/insecure" dialogue issue on SSL pages
	this.iframe.src = 'javascript:false;';

	//the negative tabindex takes it out of the taborder
	this.iframe.tabIndex = '-1';

	//append the iframe to the page
	this.body.appendChild(this.iframe);

	//set its position and dimensions to match the loading screen
	this.iframe.style.left = this.screen.style.left;
	this.iframe.style.top = this.screen.style.top;
	this.iframe.style.width = this.screen.offsetWidth + 'px';
	this.iframe.style.height = this.screen.offsetHeight + 'px'

	//make the iframe visible
	this.iframe.style.visibility = 'visible';
};

//remove the iframe shim
BeatBox.prototype.removeIframeShim = function()
{
	//ignore this if the iframe shim is not present
	if(!this.iframe) { return; }

	//remove the iframe and nullify the reference
	this.iframe.parentNode.removeChild(this.iframe);
	this.iframe = null;
};


//get the canvas size
BeatBox.prototype.getCanvasSize = function()
{
	if(typeof window.innerWidth != 'undefined')
	{
		var canvas = {
			'width' : window.innerWidth,
			'height' : window.innerHeight
			};

		if(this.isgecko)
		{
			if(this.body.offsetHeight > canvas.height)
			{
				canvas.width -= 17;
			}
			else
			{
				canvas.width -= 1;
			}
			canvas.height -= 1;
		}
	}
	else if(this.quirksmode)
	{
		canvas = {
			'width' : document.body.clientWidth,
			'height' : document.body.clientHeight
			};
	}
	else
	{
		canvas = {
			'width' : document.documentElement.offsetWidth - (this.needsiframeshim ? 21 : 0),
			'height' : document.documentElement.offsetHeight
			};
	}
	return canvas;
};

//get the scrolling offset
BeatBox.prototype.getScrollingOffset = function()
{
	if(typeof window.pageXOffset != 'undefined')
	{
		var scrolling = {
			'left' : window.pageXOffset,
			'top' : window.pageYOffset
			};
	}
	else if(this.quirksmode)
	{
		scrolling = {
			'left' : document.body.scrollLeft,
			'top' : document.body.scrollTop
			};
	}
	else
	{
		scrolling = {
			'left' : document.documentElement.scrollLeft,
			'top' : document.documentElement.scrollTop
			};
	}
	return scrolling;
};