<link rel="stylesheet" type="text/css" href="<?=media_base_url()?>css/new_buttons.css" />


<div id="container2"> <!-- container2 -->

	<div class="isci_po_kategoriji">
		<!-- <div>
			<span>išči po kategoriji</span>
		</div> -->

		<form method="GET">
		<table>
		<tbody>
		<tr>
		<td class="first">
		<input title="Išči v tej kategoriji..." value="" class="search_top1" id="inputString_company" name="niz" type="text" />
		<a title="Počisti iskalni niz" href="<?=current_url()?>">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>
		</td>
		<td>
		<input class="button" type="submit" value=" " />
		</td>
		</tr>
		</tbody>
		</table>
		</form>
	</div>

	<?=br(1)?>



	<!-- LEFT -->
	<div id="left1">
		TEST
	</div>



	<!-- CONTENT -->
	<div id="right1">

		<!-- ADS CONTENT -->

		<img src="<?=media_base_url()?>css/images/ajax-loader.gif" id="loader" style="display:none;" />

		<form id="hiddenFields">
		<input type="hidden" name="orderBy" value="" />
		<input type="hidden" name="orderWay" value="" />
		<input type="hidden" name="perPage" value="" />
		</form>


		<section id="pagination"></section>
		<section id="toolbar"></section>
		<div class="lnsep"></div>
		<section id="ads"></section>

	</div>

	<!--
	<div class="actions newbutton-container">
				<a class="newbuttonempty" title="Osveži oglase"><span class="reload gIcon"></span></a>

				<div class="newbutton-group">
					<a class="newbutton icon reload">Osveži</a>
				</div>
			</div>
	 -->


	<div id="clear"></div>



</div><!-- container2 -->

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript" src="/style/js/jquery.cookie.js"></script>
<script type="text/javascript" src="/style/js/jquery.loadmask.js"></script>
<script type="text/javascript">
function get_data(currentUrl, extraDatas)
{
	// REQUEST
	var request = $.ajax({
		url: "/server/ads/ads_list",
	    type: "POST",
	    dataType: "json",
	    data: {currentUrl:currentUrl, extra:extraDatas },
	    beforeSend: function( xhr ) {
			_loading.show();
			_ads_listing.mask("Nalagam...");
	    }
	});
	request.done(function(data) {
		if( data )
			echo_data(data)
		_loading.hide();
		_ads_listing.unmask();
	});
	request.fail(function(jqXHR, textStatus) {
		_ads_listing.html(textStatus);
		_loading.hide();
		_ads_listing.unmask();
	});
};
function echo_data(data)
{
	var length = data.count;
	var length_all = data.count_all;

	// Prebuild
	_pagination.html(data.pagination_links);
	_toolbar.html(data.per_page+data.ordering_links);


	var data = data.ads;
	var appendHtml = [];

	for(var i = 0; i < length; i += 1)
	{
		var info = data[i];
		var html = "";

		html = "<div class='listing second' rel='caption'>";

		// Image
		html += "<div class='item-picture'>"+info['image']+"</div>";
		// Title
		html += "<div class='item-title'><a href='/oglas/ogled/"+info['id']+"/"+info['slug']+"'>"+info['title']+"</a></div>";
		// Description
		html += "<div class='item-desc'>"+info['desc']+"</div>";
		// Price
		html += "<div class='item-price'>"+info['price']+"</div>";



		html += "</div>";

		appendHtml[i] = html;
	}
	_ads_listing.html(appendHtml.join(''));
}

//Variables
var _loading = $("#loader");
var _ads_listing = $("#ads");
var _pagination = $("#pagination");
var _toolbar = $("#toolbar");
//Ajax variables
var length = 0;
var length_all = 0;

jQuery(function($) {

	var _currentPage = 1;
	var _currentUrl = window.location.hash;

	var extraData = new Array();

	// Click on pagination
	_pagination.find('a').live('click',function() {
		var goalPage = $(this).attr('page');

		if( goalPage )
		{
			var _temp_url = _currentUrl.replace("#","");
			var _temp_url2 = _temp_url.split(",");

			var contain = containsRegex(_temp_url2, /stran/);

			if( contain !== null )
			{
				var pageNr = "stran="+goalPage;
				_temp_url2[contain[0]] = pageNr;
			}
			else
			{
				if( _temp_url2.length > 0 )
					_temp_url2[_temp_url2.length] = ",stran="+goalPage;
				else
					_temp_url2[0] = "#stran="+goalPage;
			}
			extraData = $("#hiddenFields").serialize();

			_currentUrl = "#" + _temp_url2.join(",");
			var f = get_data(_currentUrl, extraData);
		}
	});

	// Click on sorting
	_toolbar.find('a').live('click',function() {
		var orderBy  = $(this).attr('orderBy');
		var orderWay = $(this).attr('orderWay');

		if( orderBy && orderWay )
		{
			$("input[name=orderBy]").val(orderBy);
			$("input[name=orderWay]").val(orderWay);

			// Save ordering in cookie
			$.cookie("pw_listing_ordering_by", orderBy);
			$.cookie("pw_listing_ordering_way", orderWay);

			extraData = $("#hiddenFields").serialize();

			var f = get_data(_currentUrl, extraData);
		}
	});

	// Click on show Per Page
	$("#changePerPage > li").live('click',function() {
		$("#changePerPage").hide();
		var perPageValue = $(this).val();
		$(".currentPerPage").text(perPageValue);
		if( perPageValue )
		{
			// Save results per page to cookie
			$.cookie("pw_listing_perPage", perPageValue);
			$("input[name=perPage]").val(perPageValue);

			// Set page to first one
			var _temp_url = _currentUrl.replace("#","");
			var _temp_url2 = _temp_url.split(",");

			var contain = containsRegex(_temp_url2, /stran/);

			if( contain !== null )
			{
				_temp_url2[contain[0]] = "stran=1";
			}
			else
			{
				if( _temp_url2.length > 0 )
					_temp_url2[_temp_url2.length] = ",stran=1";
				else
					_temp_url2[0] = "#stran=1";
			}

			extraData = $("#hiddenFields").serialize();
			_currentUrl = "#" + _temp_url2.join(",");
			var f = get_data(_currentUrl, extraData);
		}
	});


	// DATA
	var cookies = [];
	cookies['ordering_by']  = $.cookie("pw_listing_ordering_by");
	cookies['ordering_way'] = $.cookie("pw_listing_ordering_way");
	console.log(cookies);
 	if( cookies['ordering_by'] && cookies['ordering_way'] )
	{
		$("input[name=orderBy]").val($.cookie("pw_listing_ordering_by"));
		$("input[name=orderWay]").val($.cookie("pw_listing_ordering_way"));
		extraData = $("#hiddenFields").serialize();
		var f = get_data(_currentUrl,extraData);
	}else if( $.cookie("pw_listing_perPage") ){
		$("input[name=perPage]").val($.cookie("pw_listing_perPage"));
		extraData = $("#hiddenFields").serialize();
		var f = get_data(_currentUrl,extraData);
	}
	else
	{
		var f = get_data(_currentUrl);
	}



	$(".toolbarPerPage").find('span').live('click',function() {
		$("#changePerPage").toggle();
	});
});

function containsRegex(a, regex){
	for(var i = 0; i < a.length; i++) {
		var pos = a[i].search(regex);
	    if(pos > -1){
		    return [i, pos];
	    }
	}
	return null;
}
</script>