<div class="body">

<div class="row">
	<div class="col-lg-12">
		<div class="text-center"><h2>{{ @lang_stats_and_performance_for }} {{ @start_date }} - {{ @end_date }}</h2></div>
	</div>
</div>

<div class="row">
	<div class="col-lg-12">

		<div class="text-center">

			<repeat group="{{ @stats.stats_totals }}" value="{{ @totals }}">
						<span class="quick-btn">
							<i class="fa {{ @totals.font }} fa-2x"></i>
							<span>{{ @totals.name }}</span>
							<span class="label label-success">{{ @totals.value }}</span>
						</span>
			</repeat>

		</div>
	</div>

</div>

<div class="row">
	<div class="col-lg-12">
		<div class="box">
			<header>
				<h5>{{ @lang_overall_performance }}</h5>
			</header>
			<div class="body text-center" id="stats_chart" style="height: 300px;"><h4><img src="{{ IncludeAsset('assets/img/wait.gif') }}" alt="{{ @lang_generating }}..."/> {{ @lang_generating }}...</h4></div>
		</div>
	</div>
</div>

<div class="row">
	<div class="col-lg-12">
		<div class="box">
			<header>
				<div class="icons">
					<i class="fa fa-table"></i>
				</div>
				<h5>{{ @lang_data }}</h5>
			</header>
			<div id="collapse4" class="body">
				<table id="dataTable" class="table table-bordered table-condensed table-hover table-striped">
					<thead>
					<tr>
						<repeat group="{{ @stats.data_table.cols }}" value="{{ @data_table }}">
							<th>{{ @data_table }}</th>
						</repeat>
					</tr>
					</thead>
					<tbody>
					<repeat group="{{ @stats.data_table.rows }}" value="{{ @data_table }}">
						<tr>
							<repeat group="{{ @data_table }}" value="{{ @row }}">
								<td>{{ @row }}</td>
							</repeat>
						</tr>
					</repeat>
					</tbody>
				</table>
			</div>
		</div>
	</div>
</div><!-- /.row -->




<div class="row">

	<check if="{{ (!empty(@stats.stats_geo_graph)) }}">

<div class="row">
	<div class="col-lg-12">
		<div class="box">
			<header>
				<h5>{{ @lang_visitor_locations }}</h5>
			</header>
			<div class="body text-center" id="stats_geo_graph" style="height: 300px;"><h4><img src="{{ IncludeAsset('assets/img/wait.gif') }}" alt="{{ @lang_generating }}..."/> {{ @lang_generating }}...</h4></div>
		</div>
	</div>
</div>


	</check>

</div><!-- /.row -->

<div class="row">

	<check if="{{ (!empty(@stats.stats_general.referers)) }}">

		<div class="col-lg-6">
			<div class="box">
				<header>
					<h5>{{ @lang_referers }}</h5>
				</header>
				<div class="body">
					<table id="referer_table" class="table table-condensed table-hovered sortableTable">
						<thead>
						<tr>
							<th>{{ @lang_referer }}
								<i class="fa fa-sort"></i>
								<i class="fa fa-sort-asc"></i>
								<i class="fa fa-sort-desc"></i>
							</th>
							<th>{{ @lang_count }}
								<i class="fa fa-sort"></i>
								<i class="fa fa-sort-asc"></i>
								<i class="fa fa-sort-desc"></i>
							</th>
							<th>{{ @lang_percentage }}
								<i class="fa fa-sort"></i>
								<i class="fa fa-sort-asc"></i>
								<i class="fa fa-sort-desc"></i>
							</th>
						</tr>
						</thead>
						<tbody>
						<repeat group="{{ @stats.stats_general.referers }}" value="{{ @referer }}">
							<tr>
								<td>{{ @referer.title }}</td>
								<td>{{ @referer.impressions }}</td>
								<td>{{ @referer.percentage }} %</td>
							</tr>
						</repeat>
						</tbody>
					</table>
					<div id="referer_pager" class="pager">
						<form>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/first.png') }}" class="first"/>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/prev.png') }}" class="prev"/>
							<input type="text" class="pagedisplay"/>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/next.png') }}" class="next"/>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/last.png') }}" class="last"/>
							<select class="pagesize">
								<option selected="selected"  value="10">10</option>
								<option value="20">20</option>
								<option value="30">30</option>
								<option  value="40">40</option>
							</select>
						</form>
					</div>
				</div>
			</div>
		</div>

	</check>

	<check if="{{ (!empty(@stats.stats_general.hostnames)) }}">
		<div class="col-lg-6">
			<div class="box">
				<header>
					<h5>{{ @lang_ad_locations }}</h5>
				</header>
				<div class="body">
					<table id="hostname_table" class="table table-condensed table-hovered sortableTable">
						<thead>
						<tr>
							<th>{{ @lang_hostname }}
								<i class="fa fa-sort"></i>
								<i class="fa fa-sort-asc"></i>
								<i class="fa fa-sort-desc"></i>
							</th>
							<th>{{ @lang_count }}
								<i class="fa fa-sort"></i>
								<i class="fa fa-sort-asc"></i>
								<i class="fa fa-sort-desc"></i>
							</th>
							<th>{{ @lang_percentage }}
								<i class="fa fa-sort"></i>
								<i class="fa fa-sort-asc"></i>
								<i class="fa fa-sort-desc"></i>
							</th>
						</tr>
						</thead>
						<tbody>
						<repeat group="{{ @stats.stats_general.hostnames }}" value="{{ @hostname }}">
							<tr>
								<td>{{ @hostname.title }}</td>
								<td>{{ @hostname.impressions }}</td>
								<td>{{ @hostname.percentage }} %</td>
							</tr>
						</repeat>
						</tbody>
					</table>
					<div id="hostname_pager" class="pager">
						<form>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/first.png') }}" class="first"/>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/prev.png') }}" class="prev"/>
							<input type="text" class="pagedisplay"/>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/next.png') }}" class="next"/>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/last.png') }}" class="last"/>
							<select class="pagesize">
								<option selected="selected"  value="10">10</option>
								<option value="20">20</option>
								<option value="30">30</option>
								<option  value="40">40</option>
							</select>
						</form>
					</div>
				</div>
			</div>
		</div>
	</check>

</div>

<div class="row">

	<check if="{{ (!empty(@stats.stats_general.browsers)) }}">
		<div class="col-lg-6">
			<div class="box">
				<header>
					<h5>{{ @lang_browsers }}</h5>
				</header>
				<div class="body">
					<table id="browser_table" class="table table-condensed table-hovered sortableTable">
						<thead>
						<tr>
							<th>{{ @lang_browser }}
								<i class="fa fa-sort"></i>
								<i class="fa fa-sort-asc"></i>
								<i class="fa fa-sort-desc"></i>
							</th>
							<th>{{ @lang_count }}
								<i class="fa fa-sort"></i>
								<i class="fa fa-sort-asc"></i>
								<i class="fa fa-sort-desc"></i>
							</th>
							<th>{{ @lang_percentage }}
								<i class="fa fa-sort"></i>
								<i class="fa fa-sort-asc"></i>
								<i class="fa fa-sort-desc"></i>
							</th>
						</tr>
						</thead>
						<tbody>
						<repeat group="{{ @stats.stats_general.browsers }}" value="{{ @browser }}">
							<tr>
								<td>{{ @browser.title }}</td>
								<td>{{ @browser.impressions }}</td>
								<td>{{ @browser.percentage }} %</td>
							</tr>
						</repeat>
						</tbody>
					</table>
					<div id="browser_pager" class="pager">
						<form>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/first.png') }}" class="first"/>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/prev.png') }}" class="prev"/>
							<input type="text" class="pagedisplay"/>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/next.png') }}" class="next"/>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/last.png') }}" class="last"/>
							<select class="pagesize">
								<option selected="selected"  value="10">10</option>
								<option value="20">20</option>
								<option value="30">30</option>
								<option  value="40">40</option>
							</select>
						</form>
					</div>
				</div>
			</div>
		</div>
	</check>

	<check if="{{ (!empty(@stats.stats_general.oss)) }}">
		<div class="col-lg-6">
			<div class="box">
				<header>
					<h5>{{ @lang_operating_systems }}</h5>
				</header>
				<div class="body">
					<table id="os_table" class="table table-condensed table-hovered sortableTable">
						<thead>
						<tr>
							<th>{{ @lang_operating_system }}
								<i class="fa fa-sort"></i>
								<i class="fa fa-sort-asc"></i>
								<i class="fa fa-sort-desc"></i>
							</th>
							<th>{{ @lang_count }}
								<i class="fa fa-sort"></i>
								<i class="fa fa-sort-asc"></i>
								<i class="fa fa-sort-desc"></i>
							</th>
							<th>{{ @lang_percentage }}
								<i class="fa fa-sort"></i>
								<i class="fa fa-sort-asc"></i>
								<i class="fa fa-sort-desc"></i>
							</th>
						</tr>
						</thead>
						<tbody>
						<repeat group="{{ @stats.stats_general.oss }}" value="{{ @os }}">
							<tr>
								<td>{{ @os.title }}</td>
								<td>{{ @os.impressions }}</td>
								<td>{{ @os.percentage }} %</td>
							</tr>
						</repeat>
						</tbody>
					</table>
					<div id="os_pager" class="pager">
						<form>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/first.png') }}" class="first"/>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/prev.png') }}" class="prev"/>
							<input type="text" class="pagedisplay"/>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/next.png') }}" class="next"/>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/last.png') }}" class="last"/>
							<select class="pagesize">
								<option selected="selected"  value="10">10</option>
								<option value="20">20</option>
								<option value="30">30</option>
								<option  value="40">40</option>
							</select>
						</form>
					</div>
				</div>
			</div>
		</div>
	</check>

</div>


<div class="row">

	<check if="{{ (!empty(@stats.stats_general.devices)) }}">
		<div class="col-lg-6">
			<div class="box">
				<header>
					<h5>{{ @lang_devices }}</h5>
				</header>
				<div class="body">
					<table id="device_table" class="table table-condensed table-hovered sortableTable">
						<thead>
						<tr>
							<th>{{ @lang_device }}
								<i class="fa fa-sort"></i>
								<i class="fa fa-sort-asc"></i>
								<i class="fa fa-sort-desc"></i>
							</th>
							<th>{{ @lang_count }}
								<i class="fa fa-sort"></i>
								<i class="fa fa-sort-asc"></i>
								<i class="fa fa-sort-desc"></i>
							</th>
							<th>{{ @lang_percentage }}
								<i class="fa fa-sort"></i>
								<i class="fa fa-sort-asc"></i>
								<i class="fa fa-sort-desc"></i>
							</th>
						</tr>
						</thead>
						<tbody>
						<repeat group="{{ @stats.stats_general.devices }}" value="{{ @device }}">
							<tr>
								<td>{{ @device.title }}</td>
								<td>{{ @device.impressions }}</td>
								<td>{{ @device.percentage }} %</td>
							</tr>
						</repeat>
						</tbody>
					</table>
					<div id="device_pager" class="pager">
						<form>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/first.png') }}" class="first"/>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/prev.png') }}" class="prev"/>
							<input type="text" class="pagedisplay"/>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/next.png') }}" class="next"/>
							<img src="{{ IncludeAsset('assets/lib/tablesorter/addons/pager/icons/last.png') }}" class="last"/>
							<select class="pagesize">
								<option selected="selected"  value="10">10</option>
								<option value="20">20</option>
								<option value="30">30</option>
								<option  value="40">40</option>
							</select>
						</form>
					</div>
				</div>
			</div>
		</div>
	</check>

</div>

</div>


<script>
	var geoChartData='{{ @stats.stats_geo_graph | raw }}';
	var chartData='{{ @stats.stats_graph | raw }}';
</script>

