function Popsaa() {
	
	this.popularity = Array();
 
	this.genres = Array();
	

	
	
 this.genres[1] = Object();
this.genres[1].id = 1;
this.genres[1].name = "Pop/Rock";
this.genres[1].icon = "http://static.yle.mobi/popsaa/gfx/rock.gif";
this.genres[2] = Object();
this.genres[2].id = 2;
this.genres[2].name = "Jazz";
this.genres[2].icon = "http://static.yle.mobi/popsaa/gfx/jazz.gif";
this.genres[3] = Object();
this.genres[3].id = 3;
this.genres[3].name = "Country/Western";
this.genres[3].icon = "http://static.yle.mobi/popsaa/gfx/rock.gif";
this.genres[4] = Object();
this.genres[4].id = 4;
this.genres[4].name = "Blues";
this.genres[4].icon = "http://static.yle.mobi/popsaa/gfx/bluesjazz.gif";
this.genres[5] = Object();
this.genres[5].id = 5;
this.genres[5].name = "Folk/World";
this.genres[5].icon = "http://static.yle.mobi/popsaa/gfx/world_folk.gif";
this.genres[6] = Object();
this.genres[6].id = 6;
this.genres[6].name = "Klassinen";
this.genres[6].icon = "http://static.yle.mobi/popsaa/gfx/klassinen.gif";
this.genres[7] = Object();
this.genres[7].id = 7;
this.genres[7].name = "Electronic/HipHop";
this.genres[7].icon = "http://static.yle.mobi/popsaa/gfx/rap.gif";
this.genres[8] = Object();
this.genres[8].id = 8;
this.genres[8].name = "Hardrock/Metal";
this.genres[8].icon = "http://static.yle.mobi/popsaa/gfx/heavy.gif";
this.genres[9] = Object();
this.genres[9].id = 9;
this.genres[9].name = "Iskelmä";
this.genres[9].icon = "http://static.yle.mobi/popsaa/gfx/iskelma.gif";
 
 
 	this.events = Array();
var events;
var event;
 
	popsaa = this;
	
	this.timeout = null;
	 
	for(var pop in this.popularity) {
                                   
                var genre = this.genres[this.popularity[pop]];
                
                var image = $('<img/>')
                		.attr('src', genre.icon)
                		.attr('class','popsaa_icon')
                		.attr('id', 'popsaa_image_'+genre.id)
                		.hover(
                				function () {
                					clearTimeout(popsaa.timeout);
                			        popsaa.show(this.id);                			        
                			      }, 
                			      function () {
                			    	clearTimeout(popsaa.timeout);
                			    	popsaa.timeout = setTimeout("$('#popsaa_hover').hide()", 2000);
                			      }
                				);				                                  
                image.appendTo('#popsaa_icons');
                                    
      }
    
    this.show = function(genreId) {
    	genreId = genreId.substring(13);
    
    	var icons = $('#popsaa_icons');
    	var hover = $('#popsaa_hover');
    	hover.html('<div class="popsaa_close"><a id="p_c" href="#"></a></div>'+
    	'<div id="popsaa_meteli"><a href="http://meteli.net" target="_new">&gt; meteli.net</a></div>'+
    	'<div class="popsaa_title">'+this.genres[genreId].name+'</div>');
    	
    	var ul = $('<ul class="popsaa_ul"></ul>');
    	
    	for(var id in this.genres[genreId].events) {
    				var event = this.genres[genreId].events[id];
    				$('<li class="popsaa_li"><a class="popsaa_a" href="'+event.url+'" target="_new">'+event.name
    				+' ('+event.city+', '+event.location+')'		
    				+'</a></li>').appendTo(ul);    		
		}		    			    
		
						
    	
    	ul.appendTo('#popsaa_hover');
    	
    	$(function(){
    		$('.popsaa_ul li:even').addClass('popsaa_li_stripe');
  		});
  		
  		
				$('ul.popsaa_ul').each(function() {
		
					var currentPage = 0;
					var numPerPage = 15;
		
					var $ul = $(this);
		
					$ul.bind('repaginate', function() {
						$ul.find('li').show()
							.slice(0, currentPage * numPerPage)
								.hide()
							.end()
							.slice((currentPage + 1) * numPerPage)
								.hide()
							.end();
					});
		
					var numRows = $ul.find('li').length;
					var numPages = Math.ceil(numRows / numPerPage);
		
					var $pager = $('<div class="popsaa_pager">Sivu: </div>');
					for (var page = 0; page < numPages; page++) {
						$('<span class="popsaa_page_number">' + (page + 1) + '</span>')
						.bind('click', {'newPage': page}, function(event) {
							currentPage = event.data['newPage'];
							$ul.trigger('repaginate');
							$(this).addClass('popsaa_active').siblings().removeClass('popsaa_active');
						})
						.appendTo($pager).addClass('popsaa_clickable');
					}
					$pager.find('span.popsaa_page_number:first').addClass('popsaa_active');
					$pager.insertBefore($ul);
		
					$ul.trigger('repaginate');
				});
  		
    	
    	var iconsOffset = icons.offset();
    	
    	var left = iconsOffset.left-(hover.width()/2);
    	if(left < 0) {
    		left = 0;
    	}
    	var top = iconsOffset.top+icons.height();
    	    	        	
    	hover.fadeIn('fast');    	    	
    	    	    	
    	popsaa = this;
    	$('#p_c').click(function() {
    		clearTimeout(popsaa.timeout);
    		popsaa.hide();
    		return false;
    	});
    	hover.hover(function() {
    		clearTimeout(popsaa.timeout);
    		}, function() {
    		$(this).fadeOut('fast');
    	});
    	
    }
    this.hide = function(genreId) {
    	$('#popsaa_hover').fadeOut('fast');
    }
    
    
	
}
