// This file demonstrates the different options of the pagination plugin
// It also demonstrates how to use a JavaScript data structure to 
// generate the paginated content and how to display more than one 
// item per page with items_per_page.
        
/**
 * Callback function that displays the content.
 *
 * Gets called every time the user clicks on a pagination link.
 *
 * @param {int}page_index New Page index
 * @param {jQuery} jq the container with the pagination links as a jQuery object
 */
function pageselectCallback(page_index, jq){
    // Get number of elements per pagionation page from form
    //var items_per_page = $('#items_per_page').val();
    var items_per_page = 12;
    newContent(page_index, jq, items_per_page);
    return false;
}
function formselectCallback(page_index, jq) {
	//var items_per_page = getOptionsFromForm();
	newContent(page_index, jq, products.length);
	return false;
}
function formselectCallback2(page_index, jq) {
	//var items_per_page = getOptionsFromForm();
	newContent(page_index, jq, 12);
	return false;
}
function newContent(page_index, jq, items_per_page) {
    var max_elem = Math.min((page_index+1) * items_per_page, products.length);
    var newcontent = '';
    var newcontent2 = '';
    
    
    
    // Iterate through a selection of the content and build an HTML string
    for(var i=page_index*items_per_page;i<max_elem;i++)
    {
    	newcontent += '<li class="productItem">';
        newcontent += '<a href="' + products[i][3] + '">';
        newcontent += '<img src="' + products[i][0] + '">';
        newcontent += '<h3>' + products[i][4] + '</h3></a>';
        newcontent += '<p>Product No. ' + products[i][5] + '</p>';
        newcontent += '</li>';
        
    }
    
    // Replace old content with new content
    $('#Searchresult').html(newcontent);
    
    // page x of y
    page_total = Math.ceil(products.length/items_per_page);
    newcontent3 = 'page '+(page_index+1)+' of '+page_total;
    $('#PageInfo').html(newcontent3);
    
    if (items_per_page == 12) {
    	newcontent2 += '<form id="paginationoptions" name="paginationoptions"><input type="hidden" id="items_per_page" name="items_per_page" value="'+products.length+'"><input type="button" id="setoptions" class="action" name="options" value="View All"></form>';
    } else {
    	newcontent2 += '<form id="paginationoptions2" name="paginationoptions2"><input type="hidden" id="items_per_page2" name="items_per_page2" value="12"><input type="button" id="setoptions2" name="setoptions2" class="action" value="Page View"></form>';
    }
    
    // Replace viewOptiosn content 
    //$('#viewOptions').html(newcontent2);
    
    // Prevent click eventpropagation
    return false;
}


function getOptionsFromForm(){
    //var opt = {callback: pageselectCallback};
    var opt = '';
    // Collect options from the text fields - the fields are named like their option counterparts
    /*            $("input:text").each(function(){
                    //opt[this.name] = this.className.match(/numeric/) ? parseInt(this.value) : this.value;
                    opt[this.name] = parseInt(this.value);
                });
    */           
    //opt = document.paginationoptions.items_per_page.value;
    /*if (opt) {
    	return parseInt(opt);
    } else {
    	return 12;
    }*/
    //document.write(opt['items_per_page']);
    //return opt['items_per_page'];
    //return $('#items_per_page').val();
    /*if (opt == products.length) {
    	opt = 12;
    } else {
    	opt = products.length;
    }*/
    //document.write(opt);
    return opt;
}
// When document has loaded, initialize pagination and form 
$(document).ready(
	function() {
	
		// Create pagination element
	    var opt = 12;
	    $("#Pagination").pagination(
	    	products.length,  {
	    		items_per_page:12,
	    		prev_text:'Prev',
	    		next_text:'Next',
	    		callback:pageselectCallback,
	    		num_display_entries:3,
	    		num_edge_entries:2,
	    		prev_show_always:false,
	    		next_show_always:false
	    	}
	    ); 
	    
	    // Event Handler for for button
		$("#setoptions").click(
			function() {
		        var opt = getOptionsFromForm();
		        //document.write(opt);
		        // Re-create pagination content with new parameters
		         $("#Pagination").pagination(
		        	products.length,  {
			    		items_per_page:products.length,
			    		prev_text:'Prev',
			    		next_text:'Next',
			    		callback:formselectCallback,
			    		num_display_entries:3,
			    		num_edge_entries:2,
			    		prev_show_always:false,
			    		next_show_always:false
			    	}
		    	);
	
			}
		);
		
		// Event Handler for for button
		$("#setoptions2").click(
			function() {
		        var opt = getOptionsFromForm();
		        //document.write(opt);
		        // Re-create pagination content with new parameters
		         $("#Pagination").pagination(
		        	products.length,  {
			    		items_per_page:12,
			    		prev_text:'Prev',
			    		next_text:'Next',
			    		callback:formselectCallback2,
			    		num_display_entries:3,
			    		num_edge_entries:2,
			    		prev_show_always:false,
			    		next_show_always:false
			    	}
		    	);
	
			}
		);
	
	}
);