<div class="row-fluid">
	<div class="span1 hidden-phone"></div>
	<div class="span10">
		<ul id="msgops">
			<li id="addfilter">${h.link_to(_('Apply Filters'), url(controller='reports', action='index', anchor='form-area'))}</li>
			<li>${h.link_to(_('Download PDF'), url(controller='reports', action='display', reportid=c.reportid) + '.pdf')}</li>
			<li>${h.link_to(_('Download CSV'), url(controller='reports', action='display', reportid=c.reportid) + '.csv')}</li>
		</ul>
	</div>
	<div class="span1 hidden-phone"></div>
</div>
<div class="space-6"></div>
${forms.form()}
<div class="space-6"></div>
${forms.select_filter('reports')}\
<div class="space-6"></div>
<div class="row-fluid">
	<div class="span1 hidden-phone"></div>
	<div class="span10">
		<div class="row-fluid">
			<div class="span8">
				<table class="table table-bordered table-condensed table-hover table-striped">
					<thead>
						<tr>
							<th>${_('#')}</th>
							<th>${_('IP address')}</th>
							<th class="hidden-phone">${_('Hostname')}</th>
							<th>${_('Country')}</th>
							<th class="hidden-phone">${_('Total')}</th>
							<th class="hidden-phone">${_('Volume')}</th>
						</tr>
					</thead>
				<tbody id='pietbody'>
		        % for i, item in enumerate(c.top_items):
				<% counter = i + 1 %>
		        <tr>
		            <td>${counter}.</td>
		            <td><span class="label label-${counter}">&nbsp;&nbsp;</span>&nbsp;${item.address.strip()}</td>
		            <td class="hidden-phone">${h.get_hostname(item.address.strip())}</td>
		            <td>${h.country_flag(item.address.strip())}</td>
		            <td class="hidden-phone">${item.count}</td>
		            <td class="hidden-phone">${h.format_byte_size(item.size)}</td>
		        </tr>
		        % endfor
		        % if not c.top_items:
		        <tr><td colspan="6">${_('No items found')}</td></tr>
		        % endif
		       </tbody>
		       </table>
			</div>
			<div class="span4">
				<div id="chart">
					<noscript>
						% if c.top_items:
				           <img src="${url(controller='reports', action='display', reportid=request.environ['pylons.routes_dict']['reportid'])}.png" alt="graph" />
						% endif
					</noscript>
		        </div>
			</div>
		</div>
	</div>
	<div class="span1 hidden-phone"></div>
</div>


<%def name="headers()">\
<script type="text/javascript">
var rdata = ${c.chart_data|n};
</script>
</%def>

<%def name="title()">${_('Reports :: %(t)s') % dict(t=c.report_title)}</%def>
<%def name="heading()">${_('Reports :: %(t)s') % dict(t=c.report_title)}</%def>
<%def name="submenu()"></%def>
<%def name="localscripts()">
${h.stylesheet_link(h.media_url() + 'css/vendor/datepicker.css')}
${h.javascript_link(h.media_url() + 'js/vendor/jquery.clearform.min.js',
h.media_url() + 'js/vendor/jquery.maskedinput.min.js',
h.media_url() + 'js/vendor/bootstrap-datepicker.min.js',
h.media_url() + 'js/vendor/jquery.flot.min.js',
h.media_url() + 'js/vendor/jquery.flot.pie.min.js',
h.media_url() + 'js/vendor/jquery.flot.resize.min.js',
h.media_url() + 'js/baruwa/reports.common.min.js',
h.media_url() + 'js/baruwa/reports.relays.min.js')}
</%def>
<%namespace name="forms" file="../reports/form.html"/>
<%inherit file="../base.html"/>
