// Script that loads and populates Telenorarena Event Calendar

// switch when live:
//var gm_url = "/telenorarena/?view=eventXml";
var gm_url = "/?view=eventXml";

var gm_active = 0; // currently active item
var gm_display_time = 4000; // number of milliseconds to display each slide
var gm_play_on = true;

// when document ready, load xml
jQuery(document).ready(function() {

	jQuery.ajax({
		type: "GET",
		url: gm_url,
		dataType: "xml",
		error: function(XMLHttpRequest, textStatus, errorThrown)
		{
			//console.log(errorThrown);
		},
		success: function(xml) {
			gm_parse(xml)
		}
	});

});

// parse XML
function gm_parse(xml)
{
	var box = jQuery(".gm-content-box");

	// add images
	jQuery(xml).find('items').find('item').each(function(i){

		jQuery(box).append("<div class=\"gm-img-box\" id=\"gm-img-box-" + i + "\">\
							<img src=\"" + jQuery(this).find('imgUrl').text() + "\" alt=\"\" width=\"288\"/>\
							<div class=\"gm-controls\">\
								<a href=\"" + jQuery(this).find('buyUrl').text() + "\">\
									<img src=\"http://www.telenorarena.no/template/images/event/buy.png\" alt=\"Kjøp nå\" />\
								</a>\
								<a href=\"" + jQuery(this).find('readmoreUrl').text() + "\">\
									<img src=\"http://www.telenorarena.no/template/images/event/readmore.png\" alt=\"Les mer\" />\
								</a>\
							</div>\
						</div>");
	});

	// add clickable items
	var ul = jQuery(box).parent().parent().append("<ul></ul>").find("ul");
	jQuery(xml).find('items').find('item').each(function(i){

		jQuery(ul).append("<li>\
							<a href=\"JavaScript:gm_activate(" + i + ",false)\">\
								<span class=\"gm-date\">" + jQuery(this).find('date').text() + "</span>\
								<span>" + jQuery(this).find('title').text() + "</span>\
							</a>\
						</li>");
	});

	// set initial view
	jQuery(box).find(".gm-img-box").hide(0);
	jQuery(ul).find("li:first a").addClass("gm-active");

	// fade in first
	jQuery(box).find(".gm-img-box:first").fadeIn(100);

	// start playing after # time
	jQuery(box).animate( { opacity: 1}, gm_display_time, function() { 
		gm_play();
	});


	// add footer
	jQuery("#gm-event").append("\
			<div class=\"gm-bottom\">\
				<a href=\"" + jQuery(xml).find('seeAllUrl').text() + "\">\
					<img src=\"http://www.telenorarena.no/template/images/event/view_all.gif\" alt=\"Vis alle\" />\
				</a>\
				<a href=\"" + jQuery(xml).find('rssUrl').text() + "\">\
					<img src=\"http://www.telenorarena.no/template/images/event/rss.gif\" alt=\"RSS Feed\" />\
				</a>\
			</a>\
	");
}

// loop events. stops if any event is clicked
function gm_play(){
	
	// stop?
	if (gm_play_on == false) return;
	
	// get ul
	var ul = jQuery("#gm-event ul");
	
	// increase
	gm_active += 1;

	// set next to active
	if (gm_active >= jQuery(ul).find("li").length)
	{
		gm_active = 0;
	}

	// activate 
	gm_activate(gm_active,true);

	// call self after # time
	jQuery(ul).animate( { opacity: 1}, gm_display_time, function() { 
		gm_play();
	});	
}

// activates an item. Can stop gm_play
function gm_activate(id,play) {
	
	gm_play_on = play;
	
	// get container
	var ul = jQuery("#gm-event ul");

	// remove active class from current active
	jQuery(ul).find("a.gm-active").removeClass("gm-active");

	// add active class
	jQuery(ul).find("li:eq(" + id + ") a").addClass("gm-active");
	
	// fade out visible box
	jQuery(".gm-img-box:visible").fadeOut(250);

	// fade inn new box
	jQuery(".gm-img-box:eq(" + id + ")").fadeIn(250);
}