function isEven(value){
	if (value%2 == 0)
		return true;
	else
		return false;
}

function decimalToHex(d, padding) {
    var hex = Number(d).toString(16);
    padding = typeof (padding) === "undefined" || padding === null ? padding = 2 : padding;

    while (hex.length < padding) {
        hex = "0" + hex;
    }

    return hex;
}



function placePreviewInMain(pgNumber, search){
	$('.field').remove();

	

	if( !pgNumber ){
		pgNumber = parseUrlForPgNumber();
	}

	var left = 0;
	var right = 0;

	var prev = 0;
	var next = 0;
	

	if(parseInt(pgNumber) >= min_pages && typeof (pgNumber) !=  undefined ){
		if(isEven(pgNumber)){
			left = pgNumber;
			right = parseInt(pgNumber) + 1;
		}
		else{
			left = parseInt(pgNumber - 1);
			right = pgNumber;
		}

			if(left>min_pages) prev = left-1;
			else prev = 'catalog_'+number_of_cat_pages;

			if(right < max_pages) next = parseInt(right)+1;
			else next = 'max';
	}
	else{
		prev = 'min';
		next = 'catalog_3';
		left = 'catalog_0';
		right = 'catalog_1';

		if( typeof( pgNumber ) !=  'undefined'){
			
			var split = pgNumber.split('_');
			if( split[0] == 'catalog' ){
				
				if(parseInt(split[1]) > 0){

					
					if(isEven(parseInt(split[1]))){
						if( (parseInt(split[1])-1) > 0){
							
							prev = 'catalog_'+(parseInt(split[1])-1);
						}
						else prev = 'min';

						
						
						left = 'catalog_'+split[1];
						
						if((parseInt(split[1])+1) <= number_of_cat_pages ){
							right = 'catalog_'+(parseInt(split[1])+1);

							
							if((parseInt(split[1])+2) < number_of_cat_pages){
								next = 'catalog_'+(parseInt(split[1])+2);
							}
							else{
								next = min_pages;
							}
						}
						else{
							right = min_pages;
							next = min_pages+1;
						}
					}
					else{
						if( parseInt(split[1])+1 >= number_of_cat_pages ){
							right = 'catalog_'+(parseInt(split[1]));
							left = 'catalog_'+(parseInt(split[1])-1);
							next = min_pages;
							prev = 'catalog_'+(parseInt(split[1])-2);
						}
						else{
							left = 'catalog_'+(parseInt(split[1])-1);
							right = 'catalog_'+split[1];
							next = 'catalog_'+(parseInt(split[1])+1);
							if((parseInt(split[1])-2) < 0 ) prev = 'min';
							else prev = 'catalog_'+(parseInt(split[1])-2);
						}
					}


					if(parseInt(split[1]) > number_of_cat_pages){
						right = 'catalog_1';
						left = 'catalog_0';
						next = 'catalog_3';
						prev = 'min';
						pgNumber = 'min';
					}
				}
			}
		}
		
		
	}




	$('#main-page').empty();
	var z = new String(left);
	if( (left != 'catalog_0' &&  (z.split('_'))[0] == 'catalog') || ( (z.split('_'))[0] != 'catalog' && left >= min_pages ) ){
		$('#main-page').append('<div class="page-container left" id="'+left+'" style="position: absolute; left: 250px; top:100px; width: 358px; height: 506px;"><img src="folder/jpg/'+left+'.jpg" pg="'+left+'" class="page" alt="" /></div>');
	}
	if(!(parseInt(right)>max_pages) || right >= min_pages){
		$('#main-page').append('<div class="page-container right" id="'+right+'"  style="position: absolute; left: 608px; top:100px;"><img src="folder/jpg/'+right+'.jpg" pg="'+right+'" class="page" alt="" /></div>');
	}
	

	
	 changePdfLink(left,right);
	 createPrevNext(prev,next);
	


	if( typeof( pgNumber ) ==  'undefined') {
		var ValPG = 'catalog_1';
	}
	else {
		if( pgNumber != 'min' )	var ValPG = pgNumber;
		else var ValPG = 'catalog_1';
	}
		$('input[name="pgNumber"]').val(ValPG);
	document.location.hash = '#pg:'+ValPG;


	animatePreviews(pgNumber, search);


}


function animatePreviews(pgNumber, search){
	$('img.page').css({
		'width':'358px',
		'height':'506px'
	}).toggle(function(){
	var wH = $(window).height();
	var previewHeight = wH - topdown_height;
	var naviDownTop = previewHeight + topdown_height-45;



			$('#pdf-left').hide();
			$('#pdf-right').hide();


			if( ($(this).parent()).hasClass('left') ){
				$('.right').hide();

					$('.left').css({
						width: '820px',
						height: previewHeight+'px',
						overflow: 'auto'
					}).addClass('activated');
				
			}else{
				$('.left').hide();

					$('.right').css({
						width: '820px',
						left: '250px',
						height: previewHeight+'px',
						overflow: 'auto'
					}).addClass('activated');
			}

			placeCenterPdfLink(($(this).parent()).attr('id'));




		$('#prev-down').css({
			top: naviDownTop+'px'
		});

		$('#next-down').css({
			top: naviDownTop+'px'
		});

		$(this).css({
			width: '794px',
			height: '1123px'
		});
			var position = $('#main-page').position();
			placeHotSpotsOnPage($(this).attr('pg'), position, search);
			createPrevNextLarge($(this).attr('pg'));

	},function(){

		($(this).parent()).find(".field").remove();

			if( ($(this).parent()).hasClass('left') ){
				$('.right').hide();
				$('.left').css({
						width: '358px',
						height: '506px',
						overflow: 'hidden'
					}).removeClass('activated');
				placePreviewInMain(($(this).parent()).attr('id'));
					
				
			}else{
				$('.left').show();
				$('.right').css({
						left: '635px',
						width: '358px',
						height: '506px',
						overflow: 'hidden'
					}).removeClass('activated');


					placePreviewInMain( ($(this).parent()).attr('id') );
			}






		$(this).css({
			width: '358px',
			height: '506px'
		});

				$('#pdf-left').show();
				$('#pdf-right').show();
				$('#pdf-center').hide().remove();

					$('#prev-down').css({
						top: '620px'
					}, {duration: 300});

					$('#next-down').css({
						top: '620px'
					}, {duration: 300});
	});
}

function parseUrlForPgNumber(){

	var hash = document.location.hash;
	hash = hash.replace('#', '');
	hash = hash.split(';');
	

	for(var i in hash){
		var spl = hash[i].split(':');
		if(spl[0] == 'pg' ) return spl[1];
	}


	
}


function placePdfLinks(){
	$('<a href="#" target="_blank" id="pdf-left"><img  src="images/pdf.png" style="width:24px;height:24px;"  alt="pdf" /></a>').mouseover(function(){

		$(this).find('img').animate({
			width: '36px',
			height: '36px',
			left: '-=6',
			top: '-=6'
		},{duration: 300, queue: false});

	}).mouseout(function(){
		$(this).find('img').animate({
			width: '24px',
			height: '24px',
			left: '+=6',
			top: '+=6'
		},{duration: 300,  queue: false});

	}).appendTo('body');
	if( (parseUrlForPgNumber()) == 'catalog_1') {
		//hack cause changePdfLink doesnt always hide the left
		$('#pdf-left').hide();
	}

	$('<a href="#" target="_blank" id="pdf-right"><img  src="images/pdf.png" style="width:24px;height:24px;"  alt="pdf" /></a>').mouseover(function(){
		$(this).find('img').animate({
			width: '36px',
			height: '36px',
			left: '-=6',
			top: '-=6'
		}, {duration: 300, queue: false} );

	}).mouseout(function(){
		$(this).find('img').animate({
			width: '24px',
			height: '24px',
			left: '+=6',
			top: '+=6'
		}, {duration: 300, queue: false} );

	}).appendTo('body');

}


function changePdfLink(left,right){
	$('#pdf-left').show();
	$('#pdf-right').show();

	$('#pdf-left').attr("href", 'folder/pdf/'+left+'.pdf');
	$('#pdf-right').attr("href", 'folder/pdf/'+right+'.pdf');

	if( left == 'min' || left == 'catalog_0') $('#pdf-left').hide();
	if( right == 'max' || parseInt(right) > max_pages ) $('#pdf-right').hide();
}


function placeCenterPdfLink(page){
	$('#pdf-left').hide();
	$('#pdf-right').hide();

	$('#pdf-center').remove();
	$('<a href="folder/pdf/'+page+'.pdf" target="_blank" id="pdf-center"><img  src="images/pdf.png" style="width:24px;height:24px;"  alt="pdf" /></a>').mouseover(function(){

		$(this).find('img').animate({
			width: '36px',
			height: '36px',
			left: '-=6',
			top: '-=6'
		}, {duration: 300, queue: false} );

	}).mouseout(function(){
		$(this).find('img').animate({
			width: '24px',
			height: '24px',
			left: '+=6',
			top: '+=6'
		}, {duration: 300, queue: false} );

	}).appendTo('body');
}


function placeHotSpotsOnPage(pgNumber, position, search){
	
	$.ajax({
		type: "GET",
		data: {
		 'pg': pgNumber
		},
		url: "folder/xml/"+pgNumber+".xml",
		success: function(data){


			if($(data).find('index').size() == 1){
				var pageName = $(data).find('index').attr('page');
				var $i = $(data).find('page').each(function(){
					var pgNo = $(this).text();
				
					
					var itemPosition = {
						left: $(this).attr("x"),
						top: $(this).attr("y")
					}

					var itemDimensions = {
						width: $(this).attr("w"),
						height: $(this).attr("h")
					}

					
						var colorOff = '#999';
						var colorOn = '#000';
						var opa = '0.30'

						if(pageName == 'content'){
							colorOff = '#ccc';
							colorOn = '#ccc';
							opa = '0';
						}
				

					$('<div></div>').css({
						'position': 'absolute',
						'z-index':'2000',
						'left': itemPosition.left+'px',
						'top': itemPosition.top +'px',
						'width': itemDimensions.width+'px',
						'height': itemDimensions.height+'px',
						'display':'block',
						'background-color': colorOff,
						'opacity': opa

					}).addClass("field").mouseover( function(event){
						if(pageName != 'content'){
							$(this).animate({
								border: '0px solid #fff',
								backgroundColor: colorOn,
								opacity: '.80'
							}, {duration: 300, queue: false});
						}
						$(this).css({
							'cursor': 'pointer'
						});
					}).mouseout(function(event){
						$(this).text('');
						if(pageName != 'content'){
							$(this).removeClass('field-on').animate({
								border: '1px solid #ccc',
								backgroundColor: colorOff,
								opacity: opa
							}, {duration: 300, queue: false});
						}
						$(this).css({
							'cursor': 'default'
						});
					}).click( function(event){
							
							placePreviewInMain(pgNo);
						

					}).appendTo('#'+pgNumber);

					
				});
			}
			else{

				var $p = $(data).find("page");

				var $f = $p.find("fields");
				$f.find("field").each(function(){

					var code = $(this).find("code").text();

					var itemPosition = {
						left: ($(this).find("position")).attr("x"),
						top: ($(this).find("position")).attr("y")
					}

					var itemDimensions = {
						width: ($(this).find("dimensions")).attr("w"),
						height: ($(this).find("dimensions")).attr("h")
					}

					//wazne
					code = code.replace(/\s/g, "");


						var colorOff = '#999';
						var colorOn = '#000';
						var opa = '0.30'

						if( code.toLowerCase() == search ){
							colorOff = '#f00';
							colorOn = '#f60';
							opa = '0.60';
						}



					$('<div></div>').css({
						'position': 'absolute',
						'z-index':'999',
						'left': itemPosition.left+'px',
						'top': itemPosition.top +'px',
						'width': itemDimensions.width+'px',
						'height': itemDimensions.height+'px',
						'display':'block',
						'background-color': colorOff,
						'opacity': opa,
						'font-size': '8px',
						'line-height': '8px'
					}).addClass("field").mouseover( function(){
						$(this).animate({
							backgroundColor: colorOn,
							opacity: '.80'
						}, {duration: 300, queue: false});
						$(this).css({
							'cursor': 'pointer'
						});
					}).mouseout(function(event){
						$(this).text('');
						$(this).removeClass('field-on').animate({
							backgroundColor: colorOff,
							opacity: opa
						}, {duration: 300, queue: false});
						$(this).css({
							'cursor': 'default'
						});
					}).click( function(event){
						event.stopPropagation();
						window.open(shop_link+code, 'staples');
						return false;

					}).appendTo('#'+pgNumber);

				});
			} /* end of else for pages */
		}
	});

}


function placeArrows(){
	$('<div id="prev-up"><a href="#"><img src="images/arrow-left.png" class="arrow" /></a></div>')
	.mouseover(function(){
		$(this).animate({
			opacity: '1'

		}, {duration: 300, queue: false} );
	})
	.mouseout(function(){
		$(this).animate({
			opacity: '.30'
		}, {duration: 300, queue: false} );
	}).appendTo('body');


	$('<div id="next-up"><a href="#"><img src="images/arrow-right.png"  class="arrow"  /></a></div>')
	.mouseover(function(){
		$(this).animate({
			opacity: '1'

		}, {duration: 300, queue: false} );
	})
	.mouseout(function(){
		$(this).animate({
			opacity: '.30'
		}, {duration: 300, queue: false} );
	}).appendTo('body');;


	$('<div id="prev-down"><a href="#"><img src="images/arrow-left.png" class="arrow"  /></a></div>')
	.mouseover(function(){
		$(this).animate({
			opacity: '1'

		}, {duration: 300, queue: false} );
	})
	.mouseout(function(){
		$(this).animate({
			opacity: '.30'
		}, {duration: 300, queue: false} );
	}).appendTo('body');


	$('<div id="next-down"><a href="#"><img src="images/arrow-right.png" class="arrow"  /></a></div>')
	.mouseover(function(){
		$(this).animate({
			opacity: '1'

		}, {duration: 300, queue: false} );
	})
	.mouseout(function(){
		$(this).animate({
			opacity: '.30'
		}, {duration: 300, queue: false} );
	}).appendTo('body');

}


function createPrevNext(prev, next){

	$('#prev-up').show().unbind('click').click(function(){
		placePreviewInMain(prev);
	}).find('a').attr("href", "#pg:"+prev);

	$('#prev-down').show().unbind('click').click(function(){
		placePreviewInMain(prev);
	}).find('a').attr("href", "#pg:"+prev);

	$('#next-up').show().unbind('click').click(function(){
		placePreviewInMain(next);
	}).find('a').attr("href", "#pg:"+next);

	$('#next-down').show().unbind('click').click(function(){
		placePreviewInMain(next);
	}).find('a').attr("href", "#pg:"+next);


	if(next == 'max'){
		$('#next-up').hide();
		$('#next-down').hide();
	}
	if(prev == 'min' || prev == 'catalog_0'){
		$('#prev-up').hide();
		$('#prev-down').hide();
	}
}









function createPrevNextLarge(pgNumber){


	if(parseInt(pgNumber)>=0 && typeof (pgNumber) !=  undefined ){
		if( pgNumber - 1 >= min_pages ) prev = pgNumber-1;
		else if( pgNumber == 0 ) prev = 'catalog_'+number_of_cat_pages;
		else prev = 0;

		
		if( parseInt(pgNumber) + 1 <= max_pages){
			next = parseInt(pgNumber)+1;	
		}
		else next = 'max';
		
	}
	else {
		if( typeof( pgNumber ) !=  'undefined'){

				var split = pgNumber.split('_');

				if( split[0] == 'catalog' ){
					if( parseInt(split[1])>0 && parseInt(split[1]) <= number_of_cat_pages){
							var splitted = parseInt(split[1]);

							if(splitted <=  1) prev = 'min';
							else prev = 'catalog_'+(splitted - 1);

							if(splitted+1 <= number_of_cat_pages) next = 'catalog_'+(splitted+1);
							else next = 0;
					}
				}
			}
	}

	

	$('#prev-up').show().unbind('click').click(function(){
		placeActivated(prev);
	}).find('a').attr("href", "#pg:"+prev);

	$('#prev-down').show().unbind('click').click(function(){
		placeActivated(prev);
	}).find('a').attr("href", "#pg:"+prev);

	$('#next-up').show().unbind('click').click(function(){
		placeActivated(next);
	}).find('a').attr("href", "#pg:"+next);

	$('#next-down').show().unbind('click').click(function(){
		placeActivated(next);
	}).find('a').attr("href", "#pg:"+next);




	var wH = $(window).height();
	var previewHeight = wH - topdown_height;
	var naviDownTop = previewHeight + topdown_height-45;
	$('#prev-down').css({top: naviDownTop+'px'});
	$('#next-down').css({top: naviDownTop+'px'});

	if(next == 'max'){
		$('#next-up').hide();
		$('#next-down').hide();
	}
	if(prev == 'min'){
		$('#prev-up').hide();
		$('#prev-down').hide();
	}
}


function placeActivated(pgNumber){
	$('.activated').empty().attr("id", pgNumber).append('<img src="folder/jpg/'+pgNumber+'.jpg" style="width:  pg="'+pgNumber+'" class="page" alt="" />');
	animateActivated();
	createPrevNextLarge(pgNumber);
	placeCenterPdfLink(pgNumber);
	var position = $('#main-page').position();
	placeHotSpotsOnPage(pgNumber, position, '');
	$('input[name="pgNumber"]').val(pgNumber);
}


function animateActivated(){
	$('.activated img.page').click( function(){
		($(this).parent()).find(".field").remove();

		$(this).hide();
		$(this).css({
			width: '358px',
			height: '506px'
		});


		placePreviewInMain(($(this).parent()).attr('id'));

				$('#pdf-center').hide().remove();

					$('#prev-down').css({
						top: '620px'
					});

					$('#next-down').css({
						top: '620px'
					});
	});



}




function searchForCode(search){

	search = search.toLowerCase();
	search = $.trim(search.replace(/\s/g, ""));

	$.ajax({
		type: "GET",
		url: "folder/xml/search.xml",
		success: function(data){
			var $db = $('search', data);


			var results = new Array;
			
			$db.find('product').each(function(){
				var name = window.unescape($(this).attr('name'));
				name = $.trim(name);
				name = name.toLowerCase();

				var found = (name.split(search).length)-1;
				if(found>0){
					results.push(this);
				}
			});

			showSearchResults(results);

		}
	});
}


function showSearchResults(results){
	$('#search-results').empty();
	$('#close-search').remove();

	var height = parseInt(results.length)*30;
	
	if(height > 530) height = 530;
	else height = height - 25;

	if(results.length == 0) height = 20;
	

	var $s = $('#search-results');

	if(results.length == 0 ) {
			$s.css({'overflow':'hidden'}).append('<div class="search-row" style="text-align: center">'+translated.not_found+'</div>')
			.css({'display':'block'}).animate({
				height: height+'px'
			}, {duration: 1000, queue: false});
	}
	else{
		$s.css({'overflow':'auto'});
	}
	var i = 0;
	$(results).each(function(){
		i++;
		var name = unescape($(this).attr('name'));
		var pg = unescape($(this).attr('page'));
		var $sr = $('<div class="search-row"><div class="search-row-name">'+name+'</div><div style="float: right; width: 45px; text-align: left;"><img src="images/page-small.png" style="margin-right: 2px;" alt="" />'+pg+'</div></div>').click(function(){

			placePreviewInMain(pg);
			$('#close-search').remove();

			$s.animate({
				height: '0px'
			}, {duration: 500, queue: false,
				complete: function(){
					$(this).css({'display': 'none'});
					$(this).empty();
				}
			});

		}).appendTo($s);


		if(results.length == i){
			$s.css({'display':'block'}).animate({
				height: height+'px'
			}, {duration: 1000, queue: false});

			$('.search-row:first').css({'margin-top': '5px'});
			$('.search-row:odd .search-row-name').addClass('odd').hover(
				function(){
					$(this).addClass('search-hover');
				},
				function(){
					$(this).removeClass('search-hover');
				}
			);
			$('.search-row:even .search-row-name').addClass('even').hover(
				function(){
					$(this).addClass('search-hover');
				},
				function(){
					$(this).removeClass('search-hover');
				}
			);
		}

	});

	var $x = $('<div id="close-search" style="position: absolute; left: 367px; top: 4px; font-size: 1em;">x</div>');
	$x.hover(
		function(){
			$(this).css({'cursor': 'pointer'});
		},
		function(){
			$(this).css({'cursor': 'default'});
		}
	);
	$x.click(function(){
		$('#search-results').animate({
				height: '0px'
			}, {duration: 500, queue: false,
				complete: function(){
					$(this).css({'display': 'none'});
					$(this).empty();
				}
			});
		$(this).remove();
		$('input[name="productCode"]').val('');
	});
	$x.appendTo('#product-search');



	
}
