var mqAry1=['images/latest-apps/hangman.jpg', 'images/latest-apps/hangman-kid.jpg', 'images/latest-apps/memory.jpg', 'images/latest-apps/crossword.jpg', 'images/latest-apps/sudoku.jpg', 'images/latest-apps/color-virus.jpg', 'images/latest-apps/news.jpg', 'images/latest-apps/bollywood.jpg', 'images/latest-apps/cat-wiz.jpg'];
var mqAry2=['Hangman', 'Hangman Kids', 'Memory', 'Crossword', 'Sudoku', 'ColorVirus', 'NewsOnGo', 'Bollywood Tweets', 'CATwiz'];

 //var mqAry2=['', '', '', '', '', '', '', '', ''];
function start() {
   new mq('m1',mqAry1,85, mqAry2);
   // new mq('m2',mqAry2, 40);// repeat for as many fields as required
   mqRotate(mqr); // must come last
}
window.onload = start;

// Continuous Image Marquee
// copyright 24th July 2008 by Stephen Chapman
// http://javascript.about.com
// permission to use this Javascript on your web page is granted
// provided that all of the code below in this script (including these
// comments) is used without any alteration

var mqr = []; 
function mq2(id,ary,wid) {
	this.mqo=document.getElementById(id); 
	var heit = this.mqo.style.height; 
	this.mqo.onmouseout=function() {mqRotate(mqr);}; 
	this.mqo.onmouseover=function() {clearTimeout(mqr[0].TO);}; 
	this.mqo.ary=[]; 
	var maxw = ary.length; 
	for (var i=0;i<maxw;i++) {
		this.mqo.ary[i]=document.createElement('img'); 
		this.mqo.ary[i].src=ary[i]; 
		this.mqo.ary[i].style.position = 'absolute'; 		
		this.mqo.ary[i].style.left = (wid*i)+'px'; 
		this.mqo.ary[i].style.width = wid+'px'; 
		this.mqo.ary[i].style.height = heit;
		this.mqo.appendChild(this.mqo.ary[i]);
	} 
	mqr.push(this.mqo);
}

function mqRotate(mqr){
	if (!mqr) return; 
	for (var j=mqr.length - 1; j > -1; j--) {
		maxa = mqr[j].ary.length; 
		for (var i=0;i<maxa;i++) {
			var x = mqr[j].ary[i].style;  
			x.left=(parseInt(x.left,10)-1)+'px';
		} 
		var y = mqr[j].ary[0].style; 
		if (parseInt(y.left,10)+parseInt(y.width,10)<0) {
			var z = mqr[j].ary.shift(); 
			z.style.left = (parseInt(z.style.left) + parseInt(z.style.width)*maxa) + 'px'; 
			mqr[j].ary.push(z);
		}
	} 
	mqr[0].TO=setTimeout('mqRotate(mqr)',30);
	
}


function mq(id,ary,wid, appNames) {
	this.mqo=document.getElementById(id); 
	var heit = this.mqo.style.height; 
	this.mqo.onmouseout=function() {mqRotate(mqr);}; 
	this.mqo.onmouseover=function() {clearTimeout(mqr[0].TO);}; 
	this.mqo.ary=[]; 
	var maxw = ary.length; 
	for (var i=0;i<maxw;i++) {
		this.mqo.ary[i] = document.createElement('div');
		this.mqo.ary[i].style.position = 'absolute'; 		
		this.mqo.ary[i].style.left = (wid*i)+'px'; 
		this.mqo.ary[i].style.width = wid+'px'; 
		this.mqo.ary[i].style.height = '83px';
		this.mqo.ary[i].setAttribute('class', 'box');
		this.mqo.ary[i].setAttribute('align', 'center');
		this.mqo.appendChild(this.mqo.ary[i]);


		var tNode =  document.createElement('table');
		var trNode =  document.createElement('tr');
		var tdNode = document.createElement('td');

		var imgAnchorNode = document.createElement("a");
		imgAnchorNode.setAttribute('href','#');
		imgAnchorNode.setAttribute('onmouseover', 'javascript:displayApp(' + i + '); return false;');
		
		var child=document.createElement('img'); 
		child.src=ary[i];
		child.setAttribute('border', '0');
		child.setAttribute('title', mqAry2[i]);
		
		child.setAttribute('alt', mqAry2[i]);
		
		imgAnchorNode.appendChild(child);


        tNode.setAttribute('width','100%');
		tNode.appendChild(trNode);
		trNode.appendChild(tdNode);
		tdNode.appendChild(imgAnchorNode);
		tdNode.setAttribute('align','center');

		this.mqo.ary[i].appendChild(tNode);

		trNode = document.createElement('tr');
		tNode.appendChild(trNode);
		tdNode = document.createElement('td');
		trNode.appendChild(tdNode);

		var anchorNode = document.createElement("a");
		anchorNode.setAttribute('href','#');
		anchorNode.setAttribute('onmouseover', 'javascript:displayApp(' + i + '); return false;');
		//anchorNode.setAttribute('class','app_txt');


		
		var textNode = document.createTextNode(appNames[i]);
		anchorNode.appendChild(textNode);
		
		tdNode.appendChild(anchorNode);
		tdNode.setAttribute('align','center');
		tdNode.setAttribute('class','app_txt');



		// this.mqo.ary[i].appendChild(child);

		// this.mqo.ary[i].innerHtml= '<table><tr><td><img src=\'' + ary[i] + '\'/></td></tr><tr><td>AppName</td></tr></table>';
	} 
	mqr.push(this.mqo);
}
