var text = new Array();
text[0] = '<span class="bph">Web Application Development</span><br /><br />We develop and integrate user-friendly front-end interfaces with back-end databases, so that your information can be readily accessible anywhere via the Internet, without compromising information security.';

text[1] = '<span class="bph">Content Management System</span><br /><br />We develop and customise content management systems for our clients to allow them to perform frequent self-updates of their web content with ease.';

text[2] = '<span class="bph">Website Design & Development</span><br /><br /><span class="bph2">1. Website</span><br />We provide consultancy for website development, starting from design conceptualisation, right through to the completion. Alternatively, we can also help develop websites using specific design concepts provided by our clients.<br /><br /><span class="bph2">2. Microsite</span><br />We provide design and development services for creation of Microsites, also known as mini-sites or weblets, for specific purposes (e.g. product, event launch).';

text[3] = '<span class="bph">e-Commerce Solutions</span><br /><br />We design and develop e-Commerce websites and solutions for our clients, to help them realise their online business ideas. We also includes optional integration of e-payment facilities (e.g. Paypal, eNets, Google Checkout) to facilitate the processing of online payments.';

text[4] = '<span class="bph">Web-hosting & Maintenance</span><br /><br /><span class="bph2">1. Web Domain Registration</span><br />We can assist you in the registration of your web domain, as well as the renewal of your existing one.<br /><br /><span class="bph2">2. Web Hosting Setup</span><br />We are able to advice and source for the most suitable web-hosting services based on your needs and requirements.<br /><br /><span class="bph2">3. Website Maintenance</span><br />We provide maintenance and backup services for your website to ensure it has maximum uptime and critical information will not be lost in the event of unfortunate system failure. We will also update your website periodically to ensure you only have the most-to-date information on your website.';

text[5] = '<span class="bph">Office Solutions</span><br /><br /><span class="bph2">1. Customised Office Systems</span><br />We can help our clients computerised their existing workflow and processes by designing and developing an office systems. By computerising, it improves work efficiency, cuts down on unnecessary paperwork and enhances work processes.<br /><br /><span class="bph2">2. MS Office Macros Applications</span><br />We can develop and program macros for MS Office applications, such as to automate repetitive tasks in MS Excel, this will eliminate human errors and improve processing time  and work efficiency significantly.';

text[6] = '<span class="bph">Website Marketing</span><br /><br /><span class="bph2">1. Search Engine Optimisation</span><br />We are able to make our client&rsquo;s website gain better visibilty and return better search ranking in the major search engines.<br /><br /><span class="bph2">2. Web Advertising</span><br />We are able to drive traffic to our client&rsquo;s website through advertising our client&rsquo;s website with major web advertising agencies at affordable rates.';

text[7] = '<span class="bph">Web-Based Reporting</span><br /><br />We design and develop visually appealing online report (e.g annual, financial report) to present information in the form of a website.<br /><br />In doing so, our clients will be able to cut down on the printing cost and the information will be readily accessible on the internet (controlled access is also possible).';

text[8] = '<span class="bph">Flash Content</span><br /><br /><span class="bph2">1. Applications</span><br />We conceptualise, design and animate Flash applications for use in websites, microsites, games, contact forms, etc. <br /><br />The touch-screen flash game in our project page is one of many examples.<br /><br /><span class="bph2">2. Presentations</span><br />We design and produce banners, presentations, corporates and training videos using the latest Flash applications.';

var fromPos = new Spry.Effect.Utils.Position();
var toPos = new Spry.Effect.Utils.Position();
var fromPos2 = new Spry.Effect.Utils.Position();
var toPos2 = new Spry.Effect.Utils.Position();
var fromPos3 = new Spry.Effect.Utils.Position();
var toPos3 = new Spry.Effect.Utils.Position();
var fromPos4 = new Spry.Effect.Utils.Position();
fromPos.x = 320;
fromPos.y = 0;
toPos.x = 0;
toPos.y = 0;
fromPos2.x = 320;
fromPos2.y = 486;
toPos2.x = 0;
toPos2.y = 486;
fromPos3.x = 320;
fromPos3.y = 60;
toPos3.x = 0;
toPos3.y = 60;
var showon = 0;

function textIn(no) {
	document.getElementById('services_details').innerHTML = text[no];
}

function swapImage(overout, imageno)
{
	var pagename;
	switch (imageno)
	{
	case 1:
		pagename = 'home';
		break;
	case 2:
		pagename = 'approach';
		break;
	case 3:
		pagename = 'services';
		break;
	case 4:
		pagename = 'contact';
		break;
	case 6:
		pagename = 'projects';
		break;
	default:
		break;
	}
	if (currPage != imageno)
		if (overout == 0)
			document.getElementById("img_"+pagename).src="img/l"+imageno+".png";
		else if (overout == 1)
			document.getElementById("img_"+pagename).src="img/l"+imageno+"n.png";
}

function processNewPage(newpageno)
{
	//alert('currpageno='+currPage);
	//alert('newpageno='+newpageno);
	start = 1;
	if (currPage != newpageno)
	{
		currpageno = currPage;
		pageOut(currpageno);
		if (layout==1)
			setTimeout("pageIn("+newpageno+");",2000);
		else if (layout==2) {
			setTimeout("pageIn("+newpageno+");",3000);
			layout=1;
		}
	}
}

function pageIn(pageno)
{
	//alert('pagein pageno='+pageno);
	document.getElementById('home').style.visibility = "hidden";
	document.getElementById('approach').style.visibility = "hidden";
	document.getElementById('services').style.visibility = "hidden";
	document.getElementById('projects').style.visibility = "hidden";
	//document.getElementById('services_details').style.visibility = "hidden";
	document.getElementById('contact_form').style.visibility = "hidden";
	document.getElementById('contact_info').style.visibility = "hidden";
	document.getElementById('terms').style.visibility = "hidden";
	
	var pagename;
	switch (pageno)
	{
	case 1:
		pagename = 'home';
		document.getElementById('home').style.visibility = "visible";
		if (start==0) {
			slide7open = new Spry.Effect.Slide('logo_container', {horizontal: true, duration: 800, from: "0%", to: "100%",toggle: false});
			slide7close = new Spry.Effect.Slide('logo_container', {horizontal: true, duration: 800, from: "100%", to: "0%",toggle: false});
			slide7open.start();
		}
		slide1open.start();
		slide2open.start();
		break;
	case 2:
		pagename = 'approach';
		document.getElementById('approach').style.visibility = "visible";
		slide3open.start();
		slide4open.start();
		break;
	case 3:
		pagename = 'services';
		document.getElementById('services').style.visibility = "visible";
		//document.getElementById('services_details').style.visibility = "visible";
		slide5open.start();
		slide6open.start();
		break;
	case 4:
		pagename = 'contact';
		document.getElementById('contact_form').style.visibility = "visible";
		document.getElementById('contact_info').style.visibility = "visible";
		if (start==0) {
			slide7open = new Spry.Effect.Slide('logo_container', {horizontal: true, duration: 800, from: "0%", to: "100%",toggle: false});
			slide7close = new Spry.Effect.Slide('logo_container', {horizontal: true, duration: 800, from: "100%", to: "0%",toggle: false});
			slide7open.start();
		}
		slide16open.start();
		slide17open.start();
		slide18open.start();
		slide19open.start();
		break;
	case 5:
		pagename = 'terms';
		document.getElementById('terms').style.visibility = "visible";
		slide14open.start();
		slide15open.start();
		break;
	case 6:
		pagename = 'projects';
		document.getElementById('projects').style.visibility = "visible";
		if (start==0) {
			slide7open = new Spry.Effect.Slide('logo_container', {horizontal: true, duration: 800, from: "0%", to: "100%",toggle: false});
			slide7close = new Spry.Effect.Slide('logo_container', {horizontal: true, duration: 800, from: "100%", to: "0%",toggle: false});
			slide7open.start();
		}
		slide20open.start();
		slide21open.start();
		if (showon == 0) {
			window.addEvent('domready', function(){
			var data = {
			  'uhf_1.jpg': { caption: '<span class="iheader">UHF Central [Web Portal]</span><br/><span class="itext">| Design | PHP | Flash | Javascript |</span>' }, 
			  'uhf_3.jpg': { caption: '<span class="iheader">UHF Central [Web Portal]</span><br/><span class="itext">| Design | PHP | Flash | Javascript |</span>' }, 
			  'uhf_demo_1.jpg': { caption: '<span class="iheader">UHF Central [Flash Demo]</span><br/><span class="itext">| Design | Flash | Javascript |</span>' }, 
			  'uhf_demo_2.jpg': { caption: '<span class="iheader">UHF Central [Flash Demo]</span><br/><span class="itext">| Design | Flash | Javascript |</span>' }, 
			  'tll_1.jpg': { caption: '<span class="iheader">The Learning Lab [Website]</span><br/><span class="itext">| Design | HTML |</span>' }, 
			  'cc_1.jpg': { caption: '<span class="iheader">CocoaCups [Website]</span><br/><span class="itext">| Design | PHP | Javascript |</span>' }, 
			  'ds_1.jpg': { caption: '<span class="iheader">Dinghy Sailing Products [Website]</span><br/><span class="itext">| Design | PHP | Javascript |</span>' },
			  'sgpc_1.jpg': { caption: '<span class="iheader">SG PokerChips [Website]</span><br/><span class="itext">| PHP | Shopping Cart | Javascript |</span>' }, 
			  'ki.jpg': { caption: '<span class="iheader">Kwalmer Investments [Website]</span><br/><span class="itext">| Design | Photoshop |</span>' },
			  'm_en_1.jpg': { caption: '<span class="iheader">Milliken [English Exhibition Video]</span><br/><span class="itext">| Flash |</span>' }, 
			  'm_ch_1.jpg': { caption: '<span class="iheader">Milliken [Chinese Exhibition Video]</span><br/><span class="itext">| Flash | Chinese Translation Software |</span>' }, 
			  'm_ch_3.jpg': { caption: '<span class="iheader">Milliken [Chinese Exhibition Video]</span><br/><span class="itext">| Flash | Chinese Translation Software |</span>' }, 
			  'pa_1.jpg': { caption: '<span class="iheader">Prague Airport [Flash Game]</span><br/><span class="itext">| Flash | XML | Photoshop |</span>' },
			  'pa_3.jpg': { caption: '<span class="iheader">Prague Airport [Flash Game]</span><br/><span class="itext">| Flash | XML | Photoshop |</span>' },
			  'pa_5.jpg': { caption: '<span class="iheader">Prague Airport [Flash Game]</span><br/><span class="itext">| Flash | XML | Photoshop |</span>' },
			  'e_nma_1.jpg': { caption: '<span class="iheader">Esabee [Presentation Video]</span><br/><span class="itext">| Flash |</span>' }, 
			  'e_hma_1.jpg': { caption: '<span class="iheader">Esabee [Presentation Video]</span><br/><span class="itext">| Flash |</span>' },
			  'cosco.jpg': { caption: '<span class="iheader">Cosco [Advertising Banner]</span><br/><span class="itext">| Flash | Photoshop |</span>' }, 
			  'zmpc.jpg': { caption: '<span class="iheader">ZMPC [Advertising Banner]</span><br/><span class="itext">| Flash | Photoshop |</span>' }
			};
			var myShow = new Slideshow.KenBurns('show', data, {captions: true, controller: true, delay: 2000, duration: 2000, width: 318, height: 238, hu: 'projects/', thumbnails: true, transition: 'back:out', zoom: 50, linked: true, random: true});
			
			var box = new Lightbox({ 
				  'onClose': function(){ this.pause(false); }.bind(myShow), 
				  'onOpen': function(){ this.pause(true); }.bind(myShow) 
				});
			});
			showon = 1;
		}
		break;
	default:
		break;
	}
	
	if (pageno!=5) {
		var temp = document.getElementById("img_"+pagename);
		temp.src="img/l"+pageno+"c.png";
		temp.style.cursor = "default";
	}
	currPage = pageno;
}

function pageOut(pageno)
{
	//alert('pageout pageno='+pageno);
	var pagename;
	switch (pageno)
	{
	case 1:
		pagename = 'home';
		slide1close.start();
		slide2close.start();
		break;
	case 2:
		pagename = 'approach';
		slide3close.start();
		slide4close.start();
		break;
	case 3:
		pagename = 'services';
		slide5close.start();
		slide6close.start();
		if (layout==2) {
			slide12close.start();
			slide13close.start();
			setTimeout('slide8right.start();slide9right.start();slide10right.start();slide11right.start();',1500);
			setTimeout('slide7open.start();',1800);
		}
		break;
	case 4:
		pagename = 'contact';
		slide16close.start();
		slide17close.start();
		slide18close.start();
		slide19close.start();
		break;
	case 5:
		pagename = 'terms';
		slide14close.start();
		slide15close.start();
		break;
	case 6:
		pagename = 'projects';
		slide20close.start();
		slide21close.start();
		break;
	default:
		break;
	}
	
	if (pageno!=5) {
		var temp = document.getElementById("img_"+pagename);
		temp.src="img/l"+pageno+"n.png";
		temp.style.cursor = "pointer";
	/*if(document.addEventListener) {
		temp.addEventListener("mouseover",function() { swapImage(0,pageno); },false);
		temp.addEventListener("mouseout",function() { swapImage(1,pageno); },false);
		temp.addEventListener("click",function() { processNewPage(pageno); },false);
	} else if (document.attachEvent) {
		temp.attachEvent("onmouseover", function() { swapImage(0,pageno); });
		temp.attachEvent("onmouseout", function() { swapImage(1,pageno); });
		temp.attachEvent("onclick", function() { processNewPage(pageno); });
	} else {
		temp.onmouseover="javascript: swapImage(0,"+pageno+");";
		temp.onmouseout="javascript: swapImage(1,"+pageno+");";
		temp.onclick="javascript: processNewPage("+pageno+");";
	}*/
	}
}

function servicesDetails(no)
{
	if (layout==1) {
		slide7close.start();
		setTimeout('slide8left.start();slide9left.start();slide10left.start();slide11left.start();',500);
		setTimeout('slide12open.start();slide13open.start();',1500);
		layout=2;
		textIn(no);
	} else {
		slide12close.start();
		slide13close.start();
		setTimeout('textIn('+no+');',1000);
		setTimeout('slide12open.start();slide13open.start();',1500);
	}
}

function delay()
{
	//if ((document.getElementById('logo').complete == true) && (logo.complete == true) && (document.getElementById('img_home').complete == true) && (document.getElementById('img_approach').complete == true) && (document.getElementById('img_services').complete == true) && (document.getElementById('img_contact').complete == true))
	if ((allImagesLoaded() == 1) && (document.getElementById('logo').complete == true)) {
		setTimeout('pageIn(1)',500);
	} else
		setTimeout('delay()',50);
}

function allImagesLoaded()
{
	// return variable
	var imagesloaded = 1;
	// All images are saved in an array called document.images. Very usefull
	var images = document.images;
	// Loop through all the images
	for (var i = 0;i<images.length;i++)
	{
			// If the image isnt loaded we set the return varible to 0
			if(images[i].complete == false) {
					imagesloaded = 0;
			}
	}
	// This will return 0 if one or more images are not loaded and 1 if all images are loaded.
	return imagesloaded;
}