<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<script type="text/javascript" src="<?php print base_url_make('/js/codepot.js')?>"></script>
<script type="text/javascript" src="<?php print base_url_make('/js/codepot.js')?>"></script>
<link type="text/css" rel="stylesheet" href="<?php print base_url_make('/css/common.css')?>" />
<link type="text/css" rel="stylesheet" href="<?php print base_url_make('/css/project.css')?>" />
<link type="text/css" rel="stylesheet" href="<?php print base_url_make('/css/font-awesome.min.css')?>" />

<script type="text/javascript" src="<?php print base_url_make('/js/jquery.min.js')?>"></script>
<script type="text/javascript" src="<?php print base_url_make('/js/jquery-ui.min.js')?>"></script>
<link type="text/css" rel="stylesheet" href="<?php print base_url_make('/css/jquery-ui.css')?>" />

<script type="text/javascript">

var last_attempted_filter = '';
var last_successful_filter = '';
var site_url = "<?php print site_url(); ?>";
var total_num_avail = <?php print $total_num_projects; ?>; 
var total_num_shown = <?php print count($projects); ?>; 
var req_page_offset = <?php print $req_page_offset; ?>;
var req_page_size = <?php print $req_page_size; ?>;

function prepare_page_button (i, req_size)
{
	var id = "#project_catalog_mainarea_result_list_page_" + i;
	var b = $(id).button();

	b.click (
		function () 
		{
			var filter = codepot_ascii_to_hex(last_successful_filter);
			var offset = parseInt($(this).text());
			$.ajax({
				url: codepot_merge_path("<?php print site_url(); ?>", "/project/enjson_catalog/" + filter + "/" + ((offset  - 1) * req_size)),
				dataType: "json",
				success: function(data) { render_project_list (data); }
			});
		}
	);

	return b;
}

function render_project_pages (total, shown, req_offset, req_size)
{
	var pages = "";

	if (req_size <= 0) req_size = 1;
	var num_pages = parseInt((total + req_size - 1) / req_size);
	var page_no = parseInt(req_offset / req_size) + 1;

	var max_page_buttons = 9;
	var page_no_start = page_no, page_no_stop = page_no;
	var button_count = 1;
	while (button_count < max_page_buttons)
	{
		var j = button_count;
		if (page_no_start > 1 && button_count < max_page_buttons) 
		{
			page_no_start--;
			button_count++;
		}
		if (page_no_stop < num_pages && button_count < max_page_buttons) 
		{
			page_no_stop++;
			button_count++;
		}

		if (j == button_count) break; // no change
	}

	if (page_no_start > 1) 
	{
		pages = pages + "<a href='#' id='project_catalog_mainarea_result_list_page_1'>1</a>";
		if (page_no_start > 2) pages = pages + " ... ";
	}

	for (i = page_no_start; i <= page_no_stop; i++)
	{
		pages = pages + " <a href='#' id='project_catalog_mainarea_result_list_page_" + i + "'>" + i + "</a>";
	}

	if (page_no_stop < num_pages) 
	{
		if (page_no_stop + 1 < num_pages) pages = pages +  " ... ";
		pages = pages + " <a href='#' id='project_catalog_mainarea_result_list_page_" + num_pages + "'>" + num_pages + "</a>";
	}

	$("#project_catalog_mainarea_result_pages").empty();
	$("#project_catalog_mainarea_result_pages").append(pages);

	if (page_no_start > 1) prepare_page_button (1, req_size);
	for (i = page_no_start; i <= page_no_stop; i++)
	{
		var b = prepare_page_button (i, req_size);
		if (i == page_no) b.addClass ("ui-state-active");
	}
	if (page_no_stop < num_pages) prepare_page_button (num_pages, req_size);
}

function render_project_list (json)
{
	if (json.status == 'ok')
	{
		var status = json.status;
		var list = $("#project_catalog_mainarea_result_list");
		list.empty (); // empty the list first.
		for (i = 0; i < json.projects.length; i++)
		{
			var p = json.projects[i];

			var cap;
			if (p.id == p.name) cap = p.name;
			else cap = p.name + " (" + p.id + ")";

			var li = codepot_sprintf ("<li><a href='%s/project/home/%s'>%s</a> - %s</li>", 
			                          codepot_htmlspecialchars(site_url),
			                          codepot_htmlspecialchars(p.id),
			                          codepot_htmlspecialchars(cap),
			                          codepot_htmlspecialchars(p.summary));
			list.append (li);
		}

		last_successful_filter = last_attempted_filter;
		$("#project_catalog_mainarea_total_projects").text(json.total_num_projects);
		render_project_pages (parseInt(json.total_num_projects), parseInt(json.projects.length), parseInt(json.req_page_offset), parseInt(json.req_page_size));
	}
	else
	{
		/* TODO:  show error */
	}
}


$(function () { 
	// Empty the page indicators generated by the server side.
	// as i want the next page or the previous page to be loaded dynamically
	// without killing the original pagination available.
	$("#project_catalog_mainarea_result_pages").empty(); 

	$("#project_catalog_mainarea_search_button").button().click (
		function () { 
			last_attempted_filter = $('#project_search_form').serialize();
			var filter = codepot_ascii_to_hex(last_attempted_filter);

			$.ajax({
				url: codepot_merge_path("<?php print site_url(); ?>", "/project/enjson_catalog/" + filter),
				dataType: "json",
				success: function(data) { render_project_list (data); }
			});
		}
	);

	render_project_pages (total_num_avail, total_num_shown, req_page_offset, req_page_size);

	$("#project_catalog_mainarea_search_form").accordion({
		collapsible: true
	});

});
</script>

<title><?php print $this->lang->line('Projects')?></title>
</head>

<body>

<div class="content" id="project_catalog_content">

<!---------------------------------------------------------------------------->

<?php $this->load->view ('taskbar'); ?>

<!---------------------------------------------------------------------------->

<?php
$this->load->view (
	'projectbar', 
	array (
		'banner' => $this->lang->line('Projects'),

		'page' => array (
			'type' => '',
			'id' => ''
		),

		'ctxmenuitems' => array (
			array ("project/create", '<i class="fa fa-plus"></i> ' . $this->lang->line('New'), 'project_catalog_new')
		)
	)
); 
?>

<!---------------------------------------------------------------------------->

<div class="mainarea" id="project_catalog_mainarea">

<div id="project_catalog_mainarea_search_form" class="collapsible-box">
	<div id="project_catalog_mainarea_search_form_header" class="collapsible-box-header">
	<span><?php print $this->lang->line('Filters'); ?></span>
	<span id="project_catalog_mainarea_total_projects_holder"><?php printf ('%s: <span id="project_catalog_mainarea_total_projects">%d</span>', $this->lang->line('PROJECT_LABEL_TOTAL_PROJECTS'), $total_num_projects); ?></span>
	</div>

	<form id="project_search_form" class="collapsible-box-form">

		<div id="project_search_form_id_and_name">
			<?php
			// TODO: enhance filter condition operators. contains, equals, not equal, regex, etc
			print form_label($this->lang->line('ID'), 'id');
			print ' ';
			print form_input('id', set_value('owner', $search->id), 'id="project_search_id"');
			?>

			<?php
			print form_label($this->lang->line('Name'), 'name');
			print ' ';
			print form_input('name', set_value('owner', $search->name), 'id="project_search_name"');
			?>
		</div>

		<div id="project_search_form_summary">
			<?php 
			print form_label($this->lang->line('Summary'), 'summary');
			print ' ';
			print form_input('summary', set_value('summary', $search->summary), 'id="project_search_summary" size="50"');
			?>
		</div>

		<div id="project_search_form_or">
			<?php 
			print ' ';
			print form_checkbox('or', 'Y', set_checkbox('or', $search->or), 'id="project_search_or"');
			print form_label($this->lang->line('PROJECT_LABEL_MATCH_ANY_FILTERS', 'or'));
			?>
		</div>
		<?php
		printf ('<a id="project_catalog_mainarea_search_button" href="#">%s</a>', $this->lang->line('Apply'));
		?>
	</form>
</div>


<div class="result" id="project_catalog_mainarea_result">
<?php
if (empty($projects))
{
	print $this->lang->line('MSG_NO_PROJECTS_AVAIL');
}
else
{
	print '<ul id="project_catalog_mainarea_result_list">';
	foreach ($projects as $project)
	{
		/* the formatting here must match the render_project_list() javascript function */
		if ($project->name == $project->id) $cap = $project->name;
		else $cap = "{$project->name} ({$project->id})";
		$anc = anchor ("project/home/{$project->id}", htmlspecialchars($cap));
		$sum = htmlspecialchars ($project->summary);
		print "<li>{$anc} - {$sum}</li>";
	}
	print '</ul>';

	print "<div class='pages' id='project_catalog_mainarea_result_pages'>{$page_links}</div>";
}
?>
</div> <!-- project_catalog_mainarea_result -->

</div> <!-- project_catalog_mainarea -->

<div class='footer-pusher'></div> <!-- for sticky footer -->

</div> <!-- project_catalog_content -->

<!---------------------------------------------------------------------------->

<?php $this->load->view ('footer'); ?>

<!---------------------------------------------------------------------------->



</body>
</html>
