if (!window.Trioro_1)
	window.Trioro_1 = {};

var clients = new Array();
clients[0] = "match_accelerade";
clients[1] = "alliance_activate";
clients[2] = "casablanca_pub";
clients[3] = "ourpower";


var content_client = new Array();
content_client[0] = "Match Marketing";
content_client[1] = "Alliance Atlantis";
content_client[2] = "Casablanca Media Publishing";
content_client[3] = "Our Power";


var content_project = new Array();
content_project[0] = "Accelerade Website";
content_project[1] = "Activate & Win Contest";
content_project[2] = "Website & Online music database";
content_project[3] = "Our Power Website";


var content_results = new Array();
content_results[0] = "Average user spends over 3 minutes on the site";
content_results[1] = "Over 80% of site visitors entered the contest";
content_results[2] = "Website has become a significant contributor to business development";
content_results[3] = "+100 renewable energy projects";



var client_array

var selected_item = "0";

function loadimages(sender, args)
{
    for (var i=0; i<clients.length; i++) {
        sender.findName("masthead" + i).Source = "portfolio/"+ clients[i] +" masthead.jpg";
        sender.findName("icon" + i).Source = "portfolio/"+ clients[i] +" icon.jpg";
        sender.findName("client"+i).Text = content_client[i];
        sender.findName("project"+i).Text = content_project[i];
        sender.findName("results"+i).Text = content_results[i];
    }
    sender.findName("rect0").Stroke = "#FF810B0B";
    sender.findName("img0").Opacity = "1";
    sender.findName("buttonlist")["Canvas.Left"] = 421 -((clients.length-1)*27);
    transition_buttons(sender, selected_item)
    InitializeTimer();
}

Trioro_1.Page = function() 
{
}

Trioro_1.Page.prototype =
{
	handleLoad: function(control, userContext, rootElement) 
	{
		this.control = control;
		
		// Sample event hookup:	
		rootElement.addEventListener("MouseLeftButtonDown", Silverlight.createDelegate(this, this.handleMouseDown));
	},
	
	// Sample event handler
	handleMouseDown: function(sender, eventArgs) 
	{
		// The following line of code shows how to find an element by name and call a method on it.
		// this.control.content.findName("Storyboard1").Begin();
	}
}
function ButtonMouseFindMore(sender, eventArgs)
{
	window.location = "portfolio.aspx?client="+clients[selected_item];
}
function ButtonMouseClick(sender, eventArgs)
{
    InitializeTimer()
	var selected = String(sender.name).substring(3,4);
	transition_images(sender, selected);
}
function btnenter(sender, eventArgs)
{
    StopTheClock()
    var selected = String(sender.name).substring(3,4); 
    transition_buttons(sender, selected);
}
function btnleave(sender, eventArgs)
{
    transition_buttons(sender, selected_item)
    InitializeTimer();
}
function transition_buttons(sender, selected)
{
    for (var i=0; i<clients.length; i++) {
        if (i == selected){
            sender.findName("btn"+i+"_on").begin();
            sender.findName("btn"+i)["Canvas.ZIndex"] = 3;
        } else if (i == parseInt(selected)+1){
            sender.findName("btn"+i+"_half").begin();
            sender.findName("btn"+i)["Canvas.ZIndex"] = 2;
        } else if (i == parseInt(selected)-1){
            sender.findName("btn"+i+"_halfleft").begin();
            sender.findName("btn"+i)["Canvas.ZIndex"] = 2;
        } else if (i < parseInt(selected)) {
            sender.findName("btn"+i+"_slideleft").begin();
            sender.findName("btn"+i)["Canvas.ZIndex"] = 1;
        } else 
            sender.findName("btn"+i+"_slideright").begin();
            sender.findName("btn"+i)["Canvas.ZIndex"] = 1;
    }
}


function transition_images(sender, selected)
{
    for (var i=0; i<clients.length; i++) {
        if (selected_item != selected){
            sender.findName("img"+selected+"_in").begin();
            sender.findName("img"+selected_item+"_out").begin();
            sender.findName("rect"+selected).Stroke = "#FF810B0B";
            sender.findName("rect"+selected_item).Stroke = "#FF000000";
        }
    }
	selected_item = selected;
}

var secs
var timerID = null
var timerRunning = false
var delay = 1000

function InitializeTimer()
{
    // Set the length of the timer, in seconds
    secs = 4
    StopTheClock()
    StartTheTimer()
}

function StopTheClock()
{
    if(timerRunning)
        clearTimeout(timerID)
    timerRunning = false
}

function StartTheTimer()
{
    if (secs==0)
    {
        StopTheClock()
        // Here's where you put something useful that's
        // supposed to happen after the allotted time.
        // For example, you could display a message:
        var sender = document.getElementById("SilverlightControl");
        
        var selected = parseInt(selected_item) + 1;
        if (selected>(clients.length-1))
            selected = 0;
            
        transition_images(sender.content, selected);   
        transition_buttons(sender.content, selected)     
        InitializeTimer();
    }
    else
    {
        // self.status = secs
        secs = secs - 1
        timerRunning = true
        timerID = self.setTimeout("StartTheTimer()", delay)
    }
}