// first, we define our own namespace within the YAHOO library for our components
YAHOO.namespace('SATYAM');

(function(){

	// Shortcuts to some YUI library used in this example:
	var Dom   = YAHOO.util.Dom,
		Event = YAHOO.util.Event,
		Panel = YAHOO.widget.Panel;

	
	// We define the constructor for our object.  
	// The only argument we need for our panel is the id we want to give the HTML element that will contain it
	// If not provided, one will be generated for you
	YAHOO.SATYAM.LoadingPanel = function(id) {
	
		// in this case, all we have to do is call the constructor of the class we inherit from
		// giving it all the necessary configuration options.
		YAHOO.SATYAM.LoadingPanel.superclass.constructor.call(this, 
			// If not id was given, create one
			id || Dom.generateId(), 
			{
				width: "100px", 
				fixedcenter: true, 
				constraintoviewport: true, 
				underlay: "shadow", 
				close: false, 
				visible: false, 
				draggable: true
			}
		);
		
		// since our custom panel inherits from Panel, all its methods and properties are accessible through 'this'
		this.setHeader("Loading ...");
		this.setBody('<img src="loading.gif" />');
		Dom.setStyle(this.body, 'textAlign', 'center');
		this.render(document.body);
	};
	
	// We declare the above constructor to inherit from Panel
	YAHOO.lang.extend(YAHOO.SATYAM.LoadingPanel, Panel);

})();

// It is important that loaded objects register themselves so the YUI Loader, and the YUI library as a whole,
// knows what it has loaded.  
// If this declaration is missing, the Loader would wait indefinitely for it to finish loading and initializing
// (well, at least that is what it would assume it is doing)
// It is important that this line be the last one.
YAHOO.register('SATYAM.LoadingPanel', YAHOO.SATYAM.LoadingPanel, {version: "0.99", build: '11'});