// look into https://github.com/vin-ni/hover-on-touch  TODO

$.urlParam = function(name){
	var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
        if(results) {
 	  return results[1];
        } else {
          return '';
        }
}
// example.com?param1=name&param2=&id=6
//$.urlParam('param1'); // name
//$.urlParam('id');        // 6
//$.urlParam('param2');   // null

function getUrlVars()
{
    var vars = {}, hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for(var i = 0; i < hashes.length; i++)
    {
        hash = hashes[i].split('=');
//        vars.push(hash[0]);
        vars[hash[0]] = hash[1];
    }
    return vars;
}

function searchme(addme) {
  if ($("#gamesearchform").length > 0) {
    $.post("games",$('#gamesearchform').serialize()+addme,function(data) {$('#gamesearchresults').html(data)});  
  }
}
$( document ).ajaxComplete(function() {
	imagePreview();
});

$(document).ready(function() {
  $("#gamesearchform").submit(
    function(event){
	event.preventDefault();
	$btn = $(document.activeElement);
	if(!$.urlParam('search') && $btn.length && $("#gamesearchform").has($btn) && $btn[0].name == 'random') {
            searchme('&random=1');
	} else { 
            searchme('');
	}  
    }
  );
  if($.urlParam('search')) {
    searchme('&'+jQuery.param(getUrlVars()));
  } else {
    searchme('&random=1&top=1');
  }
  imagePreview();
});
 $( function() {
    $( "#slider-range" ).slider({
      range: false,
      min: 0,
      max: 40,
      values: [ 4 ],
      slide: function( event, ui ) {
        $( "#players" ).val( ui.values[0] );
        searchme('');
      }
    });
    $( "#players" ).val( $( "#slider-range" ).slider( "values", 0 ) );
  } );


var tengaiconpopupx1 = null;
var tengaiconpopupx2 = null;
var tengaiconpopupx3 = null;
var tengaiconpopupx4 = null;
var tengaiconpopup = null;

this.imagePreview = function(){	
	/* CONFIG */
		
		xOffset = 10;
		yOffset = 30;
		
		// these 2 variable determine popup's distance from the cursor
		// you might want to adjust to get the right result
		
	/* END CONFIG */
$("img.thumb").mouseenter(function(event) {
//  console.log("Enter "+$(this).attr("data-title"));
  var offset = $(this).offset();
  tengaiconpopup = $(this);
  tengaiconpopupx1 = offset.left;
  tengaiconpopupx2 = offset.left+$(this).outerWidth();
  tengaiconpopupy1 = offset.top;
  tengaiconpopupy2 = offset.top+$(this).outerHeight();
		var c = ($(this).attr("data-title") != "") ? "<br/>" + $(this).attr("data-title") : "";
          if($(this).attr("data-description") != "") { c += "<br/><br/>" + $(this).attr("data-description"); }
		$("body").append("<p id='preview'><img src='"+ ($(this).attr("data-original")? $(this).attr("data-original") : this.src.replace("_t","").replace("-thumb","")) +"' alt='Image preview' />"+ c +"</p>");								 
		$("#preview")
//			.css("top",(e.pageY - xOffset) + "px")
//			.css("left",(e.pageX + yOffset) + "px") 
			.fadeIn("fast");						
  $(document).mousemove(function( event ) {
    if(event.pageX < tengaiconpopupx1 || event.pageX > tengaiconpopupx2 || event.pageY < tengaiconpopupy1 || event.pageY > tengaiconpopupy2) {
      $(document).off("mousemove");
      $("#preview").remove();
//      console.log("Remove "+event.pageX+"x"+event.pageY+": "+tengaiconpopupx1+"x"+tengaiconpopupy1+"-"+tengaiconpopupx2+"x"+tengaiconpopupy2);
    }
  });
});
/*
	$("img.thumb").hover(function(e){
		this.t = this.title;
		this.title = "";	
		var c = (this.t != "") ? "<br/>" + this.t : "";
		$("body").append("<p id='preview'><img src='"+ this.src.replace("_t","").replace("-thumb","") +"' alt='Image preview' />"+ c +"</p>");								 
		$("#preview")
//			.css("top",(e.pageY - xOffset) + "px")
//			.css("left",(e.pageX + yOffset) + "px") 
			.fadeIn("fast");						
    },
	function(){
		this.title = this.t;	
		$("#preview").remove();
    });	
*/
/*
	$("a.preview").mousemove(function(e){
		$("#preview")
			.css("top",(e.pageY - xOffset) + "px")
			.css("left",(e.pageX + yOffset) + "px")  ;
	});			
*/
};