function featuresPanelOneTabNoSub()
{
	var self = this
	var GalleryCrnt = [0];
	var GalleryMax = [0];
	
	this.mediaGroup1=0;
	this.mediaIndex1=0;
	this.featurePanelContainer = '.BodyCell';
	this.adminAreaUL = '#AdminArea';
	this.userAreaUL = '#UserArea';
	this.liveDiv = '#Live';
	this.introDiv = '#Intro';
	this.Panel = "#Panel"
	
	var mainImage;
	var currentImage;
	var titleSource;
	var mainTitle;
	//var mainArea;
	var Panel;
	
	this.init = function() 
	{
		$(document).ready(function() 
		{
			//add panel html to the page
			addFeaturePanel();
			
			//mainArea = $(self.adminAreaUL);
			panel = $(self.Panel);
			
			GalleryMax[0]= $('img',panel).length-1;
			

			showMedia(self.mediaGroup1,self.mediaIndex1);
			
			linkBinder();
			
			
		});
	}
	var linkBinder = function()
	{
		$('a', panel).each(function (index, domEle) {
			$(domEle).bind('click',function(){
			
				showMedia(index);
				
				//separateUl(index);
				
				return false;
				
			});
		});
	
		$('#lastMedia_0').bind('click',function(){
			
			lastMedia();
			return false;
		});
		$('#nextMedia_0').bind('click',function(){
			
			nextMedia();
			return false;
		});

		
		
	}
	var showMedia = function(id)
	{
		mainImage = $('#FeatureImage');
		mainTitle = $('#FeatureTitle');
		
		currentImage = $('img', panel).eq(id);
		titleSource =  $('a', panel).eq(id);

		if(mainImage.length && currentImage.length)
		{
			GalleryCrnt[0] = id;
			
			var pic = new Image();
			$(pic).css({'display':'block'})
				  .attr('align','center')
				  .addClass('Thumb')
				  .attr('id',mainImage.attr('id'))
				  .attr('vspace','2')
				  .attr('hspace','2')
				  .bind('load',{'pic': pic },imageLoad) 
				  .attr('src',currentImage.attr('src'));
		}
	}
	// on finish loading function 
	var imageLoad =function(event)
	{
		var pic = event.data.pic;
		mainImage.replaceWith(pic);
		startTicker( mainTitle,titleSource.html());
	}
	
	
	// next image on click function -------->
	var nextMedia = function() {
		if (GalleryCrnt[0]+1 <= GalleryMax[0] ) showMedia(GalleryCrnt[0]+1);
	}
	// previous image on click function -------->
	var lastMedia = function() {
		if (GalleryCrnt[0]-1 >= 0 ) showMedia(GalleryCrnt[0]-1);
	}
	
	// title writer functions ------------->
	
	var TickerCharacterTimeout = 50;
	var TickerTitleTimeout = 4000;
	var TickerPadding1 = "_";
	var TickerPadding2 = "-";
	var TickerPadding0 = "";
	var TickerTitles = ["",""];
	var TickerLen = [0,0];
	var TickerDiv = [null,null];

	// Ticker startup
	var startTicker = function(div,title) 
	{
		TickerDiv[0] =div;
		TickerLen[0] = 0;
		TickerTitles[0] = title.replace(/&quot;/g,'"');
		runTheTicker();
	}
	var runTheTicker = function()
	{
		var myTimeout;  
		TickerDiv[0].text(TickerTitles[0].substring(0,TickerLen[0]) + TickerPadding());
		if(TickerLen[0] == TickerTitles[0].length) return;

		TickerLen[0]++;
		myTimeout = TickerCharacterTimeout;
		
		window.setTimeout(function(){runTheTicker(0)}, myTimeout);
	}
	var TickerPadding = function() 
	{
		if(TickerLen[0] == TickerTitles[0].length) return TickerPadding0;
		if((TickerLen[0] % 2) == 1) return TickerPadding1;
			else return TickerPadding2;
	}// title writer functions End ------------->
	
	
	// HTML WRITER FUNCTIONS -------------------->
	var separateUl = function(index)
	{
		var allUl = $(self.adminAreaUL);
		var subUl = $('li', allUl).eq(index).find('ul').clone(true);
		
		var clickedLi = $('li', allUl).eq(index);
		var mainUl = clickedLi.parent();
		
		if(mainUl.attr('id') == self.adminAreaUL.substring(1)) 
		{	
			$('#SubContainer').empty();
			
			var subTitle = '<div class=BlueHead>'+ clickedLi.find('a').html() +'</div>'
			if(subUl.length) $('#SubContainer').append(subTitle);
			
		}
		
		if (subUl.length)
		{	
			subUl.addClass('SubArea');
			$('#SubContainer').append(subUl);
		}
		
		
		
	}
	
	var addFeaturePanel = function()
	{
		var admin = $(self.adminAreaUL);
		var user = $(self.userAreaUL);
		var live = $(self.liveDiv).html();
		var intro = $(self.introDiv).html();
		
		$(self.adminAreaUL).remove();
		$(self.userAreaUL).remove();
		$(self.liveDiv).remove();
		$(self.introDiv).remove();
		
		var dir = $('body').css('direction');
		var nextLang,lastLang;
		var liveExample;
		if(dir =='rtl')
		{
			lastLang ='السابق';
			nextLang = 'التالى';
			liveExample = 'أمثلة حية';
		}
		else
		{
			lastLang ='Prev.';
			nextLang = 'Next';
			liveExample = 'Live Example';
		}
		
		var panelHtml ;
		panelHtml=	'<table height="100%" width="100%" cellspacing="0" cellpadding="0" border="0">'
				    +   '<tr>'
				    +       '<td id="SideCell" width=226 valign="top" nowrap align="center">'
				    +           '<div class="RedHeadingBody">'+ liveExample +'</div>'
				    +       '</td>'
				    +       '<td id="FeaturePanel" width="100%" height="100%" valign=top>'
					+			'<div><table width="100%"  border="0" cellpadding="0" cellspacing="0">'
					+			'<tr>'
					+				'<td class="FeatureTabsBody" colspan="3" valign=center align=center>'									
					+					'<div id=FirstFeatureDiv  align=center>'
					+						'<table width="100%" cellpadding="0" cellspacing="0">'
					+		                    '<tr>'
					+		                        '<td nowrap align=center><a id="lastMedia_0" href="#"><img src="../images/last_'+ dir +'.gif" width="22" height="23" border="0" align=absmiddle Hspace=4>'+ lastLang +'</a></td>'
					+		                        '<td><center><img class="thumb" id="FeatureImage" src="../images/PicLoading.jpg" vspace="2" hspace="2"></center>'
					+		                        '</td>'
					+		                        '<td nowrap align=center><a id="nextMedia_0" href="#">'+ nextLang +'<img src="../images/next_'+ dir +'.gif" width="22" height="23" border="0" align=absmiddle Hspace=4></a></td>'
					+		                    '</tr>'
					+		                    '<tr>'
					+								'<td colspan=3>'
					+		                            '<br>'
					+		                            '» <span id="FeatureTitle"></span>'
					+									'<br>'
					+								'</td>'
					+		                    '</tr>'
					+		                '</table>'
					+					'</div>'								
										/******div removed********/
					+				'</td>'
					+			'</tr>'
					+		'</table>'
					+	'</div>'
						
					+	'<div id="Panel">'   
					+		'<table cellpadding="0" cellspacing="0" width="100%">'
		            +            '<tr>'
					+		        '<td valign="top" height="100%" width=50%>'
					+		            '<div id=AdminContainer class="GrayFrameBody" style="height:100%"></div>'
					+			    '</td>' 
					+		        '<td valign="top" height="100%" width=50%>'
					+		           '<div id=SubContainer class="GrayFrameBody" style="height:100%"></div>'
					+				'</td>'
					+		    '</tr>'
					+		'</table>'
					+	'</div>'
					+'</td>'
					+'</tr>'
    				+'</table>'
						
		$(self.featurePanelContainer).append(panelHtml);
		if(intro != null) $('#FeaturePanel').prepend('<div class=bodydiv>'+ intro +'</div>');
		
		$('#AdminContainer').append(admin);
		$('#SubContainer').append(user);
		if(live != null) $('#SideCell').append(live);
		
	}
}//---- End of featuresPanel Class --->