$(document).ready(function() {
	$('tbody tr:odd').addClass('odd');
	$('tbody tr:even').addClass('even');

	// Bestell AGBs gelesen im Warenkorb?
	$('.button2').css("opacity","0.2");
	$('.button2').removeAttr('href');
	$('div.ssBasket tfoot tr td').append('<input type="checkbox" id="agbg" style="float:left;margin:2px 9px 0px 0px;" /><p>Bitte klicken Sie hier, wenn Sie die AGBs gelesen haben.</p>');
	$('#agbg').live('click',function(){
		$('.button2').animate({opacity: 1},1000);
		$('.button2').attr('href','/lego/checkout');
	});
	
	// Listen Funktionen
	var order = 1;
	var order_dir = 2;
	var suche = 'NULL';
	var limit = 10;
	var start = 0;
	var farbe = 0;
	var table = '';
	var entries = 0;
	var pages = entries/limit;
	var page = 1;
	var t;
	var t2;
	var jsondata;
	var basket_entries;

	// Zellen Farbig machen
	function rowColor()
	{
		$('tbody tr:odd').attr('class','odd');
		$('tbody tr:even').attr('class','even');
	}

	// Wieviel Teile sind im Warenkorb
	function getBasketSum()
	{
		$.ajax({
			dataType: 'json',
			async:false,
			url: "/api/getbasketsum",
			success: function(data) {
				basket_entries = data.basket_entries;
			}
		});
	}

	// Steine Holen Funktion
	function getSteine()
	{
		table = '';
		if(!suche)
		{
			suche = 'NULL';
		}
		$.ajax({
			dataType: 'json',
			async:false,
			url: "/api/getsteine/"+escape(suche)+"/"+farbe+"/"+order+"/"+order_dir+"/"+limit+"/"+start+"",
			success: function(data) {

				// Zusatz daten
				entries = data.entries;
				basket_entries = data.basket_entries;
				pages = Math.ceil(entries/limit);
				page = 1+start/limit;
				
				// Pagination
				
				$('p.ssSeite').html(page+'/'+pages);
				
				// Tabelle ausrollen
				$.each(data.steine, function(i, val){
					table = table+'<tr>\
							<td class="first style2">\
								<img \
								src="/sitedata/steine/resized/'+val.bild+'" \
								alt="Abbildung '+val.art+'"\
								/></td>\
							<td>'+val.bestell+'</td>\
							<td>'+val.art+'</td>\
							<td>'+val.farbe+'</td>\
							<td>'+val.anzahl+'</td>\
							<td style="text-align:right;">'+val.vk+' €</td>\
							<td class="last putput">\
								<a rel="'+val.id+'" title="'+val.art+' in der Farbe '+val.farbe+'">\
									<img \
										src="/sitedata/images/cart_add.png" \
										alt="'+val.art+' in den Warenkorb legen." \
									/>\
								</a>\
							</td>\
						</tr>';
				});
				if(!data.steine[0])
				{
					table = table+'<tr>\
							<td class="first style2" colspan="7">\
								Es wurden leider keine Steine, mit den angegebenen Kriterien gefunden.\
							</td>\
						</tr>';
				}
			}
		});

		$('table.ssListing tbody').html(table);
		rowColor();
	}

	function getBasket()
	{
		$.ajax({
			dataType: 'json',
			async:false,
			url: "/api/getbasket",
			success: function(data) {
				table = '';
				// Tabelle ausrollen
				$.each(data.steine, function(i, val){
					table = table+'\
					<tr>\
						<td class="first style2">\
							<img \
								src="/sitedata/steine/resized/'+val.bild+'" \
								/></td>\
						<td>'+val.bestell+'</td>\
						<td>'+addCommas(val.vk)+'</td>\
						<td>\
							<span \
								class="ssMenge" \
								rel="'+val.stein_id+'">x '+val.count+'</span>\
							<span \
								class="ssAnzahl" \
								rel="'+val.stein_id+'">x '+val.anzahl+'</span>\
						</td>\
						<td style="text-align: right;">€ '+addCommas(val.summe)+'</td>\
						<td class="ssBasketDel" style="text-align: center;">\
							<a href="http://dev.schroeders-spiel-steine.de/lego/delbasketitem/'+val.id+'" class="ssBasketDel">X</a></td>\
					</tr>';
				});
				if(!data.steine[0])
				{
					table = table+'\
						<tr>\
							<td colspan="6">\
								Leider haben Sie noch keine Steine im Warenkorb.\
							</td>\
						</tr>';
				}
				else
				{
					table = table+'\
					<tr>\
						<tr id="ssBasketSumme">\
						<td colspan="3"><!-- --></td>\
						<td>Summe: </td>\
						<td style="text-align: right;">€ '+addCommas(data.summe)+'</td>\
						<td><!-- --></td>\
					</tr>';
				}
				$('div.ssBasket table tbody').html(table);
			}
	
		});

		rowColor();
	}

	// Mehr Steine anzeigen
	function moreSteine()
	{
		table = table+'<tr>\
				<td class="first style2" colspan="7">\
					<a id="more">Mehr Steine anzeigen</a>\
				</td>\
			</tr>';
		
	}

	// Warenkorb Herz einfügen
	function addBasketHeart()
	{
		var heart_pos = $('a:contains("Warenkorb")').offset();
		$('#ssBasketHeart').remove();
		$('body').append('<a href="/lego/basket/" id="ssBasketHeart"><p>'+basket_entries+'</p></a>');
		$('#ssBasketHeart').css({
			'position':'absolute',
			'left':heart_pos.left+57,
			'top':heart_pos.top-56
		});
	}
	
	// Bestellung abschicken
	function put(element,absolute){
		
		// Wenn Die Menge nich definiert werden kann, dann 1 nehmen.
		var menge = $('#ssMengeTip input').val();
		if(!menge)
		{
			menge = 1;
		}

		$.get('/api/put/'+$(element).attr('rel')+'/'+menge+'/'+absolute,function(data){
			if(data == "true")
			{
				$.gritter.add({
					// (string | mandatory) the heading of the notification
					title: 'Stein im Warenkorb',
					// (string | mandatory) the text inside the notification
					text: 'Sie haben den Stein in den Warenkorb gelegt!',
					// Wie lange?
					time: 100
				});
			}
			else
			{
				$.gritter.add({
					// (string | mandatory) the heading of the notification
					title: 'Huch!',
					// (string | mandatory) the text inside the notification
					text: 'Sie können nicht mehr Steine als Verfügbar sind, in den Warenkorb legen. Bitte wählen Sie einen anderen Artikel aus.'
				});	
			}
			getBasketSum();
			addBasketHeart();
			if($('#ssBasket').length > 0)
			{
				getBasket();
			}
		})
	}

	// Bastelt einen Mengen Tooltip an das Element
	function ssMengeTip(element,absolute,value){
		$(element).live('mouseover', function(){
			$('div#ssMengeTip').remove();
			$('body').append('\
				<div id="ssMengeTip" style="display:none;">\
					<p><input type="text" value="'+value+'" name="menge" /></p>\
					<p class="ssButtCancel"><a name="ssMengeClose">Schliessen</a></p>\
					<p class="ssButtOk"><a name="ssMengePut" rel="'+$(this).attr('rel')+'">Warenkorb</a></p>\
					<div></div>\
				</div>'
			);
			$('div#ssMengeTip').focus();
			//get the position of the placeholder element
			var pos = $(this).offset();  
			var width = $(this).width();
			//show the menu directly over the placeholder
			$("#ssMengeTip").css( { "left": (pos.left - 42) + "px", "top":(pos.top-90) + "px" } );
			$("#ssMengeTip").fadeIn('slow');
		});
		$('a[name="ssMengeClose"]').live('click',function(){
			$('div#ssMengeTip').fadeOut('slow', function(){$(this).remove()});
			//$('div#ssMengeTip').remove();
		});
		$('a[name="ssMengePut"]').live('click',function(){
			put(this,absolute);
			$('div#ssMengeTip').fadeOut('slow', function(){$(this).remove()});
		});
		$("input").live('keydown',function(e) {
			if(e.keyCode == 13) { 
				put('#ssMengeTip a[name="ssMengePut"]',absolute);// Hier könntest du ENTER ignorieren
				$('div#ssMengeTip').fadeOut('slow', function(){$(this).remove()});
			}
		});
		
	}
	
	function addCommas(nStr)
	{
		nStr += '';
		x = nStr.split('.');
		x1 = x[0];
		x2 = x.length > 1 ? '.' + x[1] : '';
		var rgx = /(\d+)(\d{3})/;
		while (rgx.test(x1)) {
			x1 = x1.replace(rgx, '$1' + ',' + '$2');
		}
		return x1 + x2;
	}
	
	// Steine holen
	getSteine();
	
	// Herz Einfügen
	addBasketHeart();

	// Navi entfernen
	$('#weiter').removeAttr('href');
	$('#zurueck').removeAttr('href');
	$('.ssPagesWrapper').remove();
	$('#ssTableNavi form').submit(function(){return false;});

	// Events definieren
	// Hier werden alle anklickbaren Elemente definiert!
	$('.putput a').live('click',function(){
		put(this,0);
	});
	$('#weiter').live('click',function(){
		if(start < entries-limit)
		{
			start = start + limit;
			getSteine();
		}
	});
	$('#zurueck').live('click',function(){
		if(start > 0)
		{
			start = start - limit;
			getSteine();
		}
	});
	$('th:contains("Art")').live('click',function(){
		if(order == 2 && order_dir == 1)
		{
			order_dir = 2;
		}
		else
		{
			order_dir = 1;
		}
		order = 2;
		table = '';
		getSteine();
	});
	$('th:contains("proStck")').live('click',function(){
		if(order == 1 && order_dir == 1)
		{
			order_dir = 2;
		}
		else
		{
			order_dir = 1;
		}
		order = 1;
		table = '';
		getSteine();
	});
	$('#suchen').bind('keyup',function() {
		start = 0;
		suche = encodeURI($(this).val());
		clearTimeout(t);
		t = setTimeout(function (){
			table = ''; 
			getSteine();
			$.gritter.add({
				// (string | mandatory) the heading of the notification
				title: 'Tabelle aktualisiert',
				// (string | mandatory) the text inside the notification
				text: ' ',
				// Wie lange?
				time: 200
			});
		}, 1000);
	});
	$('select[name="farbe"]').bind('change',function(){
		start = 0;
		farbe = $(this).val();
		table = '';
		getSteine();
		$.gritter.add({
			// (string | mandatory) the heading of the notification
			title: 'Tabelle aktualisiert',
			// (string | mandatory) the text inside the notification
			text: ' ',
			// Wie lange?
			time: 200
		});
	});
	
	// PNG FIX!
	$('#ssLogo, a#ssBasketHeart, td.last a, #ssMengeTip p').ifixpng();

	// Wenn wir auf der Basket Seite sind
	if($('#ssBasket').length > 0)
	{
		ssMengeTip('.ssMenge',1,1);
	}
	else
	{
		ssMengeTip('.putput a',0,1);
	}
});