var __isCssFileLoaded = false;
// HACK: since widgets might be multiple-instanced, we need to know when individual 
//  instances are populated, not just a catch-all HTML "is loaded"
var __isHtmlLoaded = false;

function importCSSFile(cssUrl, widgetSelector) {
	// report starting to load the file
	reportCSSFileStatus(false);

	// add the widget CSS 
	// find the head of the HTML
	var head = $$('head').first();
	
	// this is for IE and related browsers
	var link = $(document.createElement('link'));
	link.observe('load', function() {
		// report the completion of loading
		reportCSSFileStatus(true);
	});
	
	link.href = cssUrl;
	link.rel = 'stylesheet';
	link.type = 'text/css';
	var head = document.getElementsByTagName('head').item(0)
	head.insert(link);


	// and this is for firefox-like browsers
	var style = $(document.createElement('style'));
	style.identify();
	style.type = 'text/css';
	style.media = 'all';

	// AJAX-y retrieval of the CSS content
	new Ajax.Updater(style, cssUrl, {
		method: 'get',
		evalScripts: false,

		onComplete: function(updater) {
			// report the completion of loading
			reportCSSFileStatus(true);
			head.insert(style);
		}
	});	
}

function importScriptFile(scriptUrl) {
	var script = document.createElement('script');
	script.src = scriptUrl;
	script.type = 'text/javascript';

	// Insert the created object to the html head element
	var head = document.getElementsByTagName('head').item(0);
	head.appendChild(script);
}

function reportCSSFileStatus(isDoneLoading) {
	__isCssFileLoaded = isDoneLoading;
}

function reportHtmlFileStatus(isDoneLoading) {
	__isHtmlLoaded = isDoneLoading;
}


// this method is called at the end of this script, with some hard-set parameters...
// MAKE SURE that they're populated!!
function loadWidget(elementSelector, widgetUrl, cssUrl, scriptUrl, loadingStyle, parameters) {
	// check for Prototype and Scriptaculous
	if (typeof Prototype == 'undefined') 
		throw new Error("Widgets cannot be loaded without the supporting core library.");
	if (typeof Scriptaculous == 'undefined') 
		throw new Error("Widgets cannot be loaded without the supporting effects library.");

	// load the CSS file
	importCSSFile(cssUrl, elementSelector);
	
	
	
	// find the elements to be replaced / populated
	var elemToReplace = $$(elementSelector);
	// exit if no divs found
	if (elemToReplace.size() == 0)
		return;

	// foreach div to be populated
	elemToReplace.each( function (widgetDiv) {
		
		// if widgetDiv doesn't have an id, then generate one for it
		widgetDiv.identify();
		// set the styling while it loads				
		widgetDiv.setStyle(loadingStyle);

		
		// create the Ajax.Updater that will populate the div 
		new Ajax.Updater({success: widgetDiv, failure: 'null'}, widgetUrl, {
			method: 'get',
			// populate parameters for the widget
			parameters: parameters,
			evalScripts: true,
						
			// populate the divs with Widget instances on success
			onComplete: function(updater) {
				// import the javascript to populate the elements
				importScriptFile(scriptUrl);
				
				var element = updater.request.container.success;
				element = $(element);

				element.setStyle({
					backgroundImage: 'none'
				});
				
				// report the completion of loading
				reportHtmlFileStatus(true);
				
				// first hide the pulled-down content
				// HACK: assume the widget is wrapped in a single element
				var retrievedElement = element.childElements().first();
				retrievedElement.hide();
				
				// fade the pulled content in				
				new Effect.Appear(retrievedElement, {duration: 1} );
			},
			
			// shows an error message if unable to load
			onFailure: function(updater) {
				var element = updater.request.container.success;

				element.setStyle({
					backgroundImage: 'none'
				});
				
				element.update("There was an error loading the widget.");
			}
		});
	}
	);

}