<div class="main">
<style type="text/css">
.row.even-odd-bg span
{
font-size: .8em;
//color:#555;
}
.row.even-odd-bg div label
{
color:black;
overflow:hidden;
text-overflow: ellipsis;
}
.row.even-odd-bg div:first-child label
{
font-size: 2em;
color:#0C7B77;
}
.row.even-odd-bg:nth-child(2n+2) div:first-child label
{
color:#C63672;
}
</style>
<div class="container">
<h1>{log_text}</h1>
<div class="container separated">
<div class="row filter">
<div class="three columns">
<label>{date_text}</label>
<input name="date" type="text" class="full-width ltr" value="{current_date}"/>
</div>
<div class="three columns half-col-margin">
<label>{event_text}</label>
<select name="event" type="text" class="full-width lang-en">
<option value=""></option>
<?php
foreach($event_types as $name => $index)
echo "<option value='$name'>$name</option>\n";
?>
</select>
</div>
<div class="three columns half-col-margin">
<label>{visitor_id_text}</label>
<input name="visitor_id" type="text" class="full-width lang-en"/>
</div>
<div class="two columns results-search-again half-col-margin">
<label></label>
<input type="button" onclick="searchAgain()" value="{search_again_text}" class="full-width button-primary" />
</div>
</div>
<div class="row results-count" >
<div class="six columns">
<label>
{results_text} {logs_start} {to_text} {logs_end} - {total_results_text}: {logs_total}
</label>
</div>
<div class="three columns results-page-select">
<select class="full-width" onchange="pageChanged($(this).val());">
<?php
for($i=1;$i<=$logs_total_pages;$i++)
{
$sel="";
if($i == $logs_current_page)
$sel="selected";
echo "<option value='$i' $sel>$page_text $i</option>";
}
?>
</select>
</div>
</div>
<script type="text/javascript">
var initialFilters=[];
<?php
foreach($filter as $key => $val)
echo 'initialFilters["'.$key.'"]="'.$val.'";';
?>
var rawPageUrl="{raw_page_url}";
$(function()
{
$(".filter input, .filter select").keypress(function(ev)
{
if(13 != ev.keyCode)
return;
searchAgain();
});
for(i in initialFilters)
$(".filter [name='"+i+"']").val(initialFilters[i]);
});
function searchAgain()
{
document.location=getCustomerSearchUrl(getSearchConditions());
}
function getSearchConditions()
{
var conds=[];
$(".filter input, .filter select").each(
function(index,el)
{
var el=$(el);
if(el.prop("type")=="button")
return;
if(el.val())
conds[el.prop("name")]=el.val();
}
);
return conds;
}
function getCustomerSearchUrl(filters)
{
var ret=rawPageUrl+"?";
for(i in filters)
ret+="&"+i+"="+encodeURIComponent(filters[i].trim().replace(/\s+/g," "));
return ret;
}
function pageChanged(pageNumber)
{
document.location=getCustomerSearchUrl(initialFilters)+"&page="+pageNumber;
}
</script>
</div>
<br>
<div class="container">
<?php
if($logs['total'])
for($i=$logs['start'];$i<$logs['end'];$i++)
{
$log=$logs[$i];
?>
<div class="row even-odd-bg" style="display:flex;flex-wrap:wrap">
<div class="three columns">
<label>#<?php echo 1+$i;?></label>
</div>
<?php foreach ($log as $key => $value) {
?>
<div class="three columns lang-en">
<span><?php echo $key;?></span>
<label class="lang-en" data-value-type=<?php echo $key;?>>
<?php echo $value;?>
</label>
</div>
<?php } ?>
</div>
<?php
}
?>
</div>
</div>
<script type="text/javascript">
$(function()
{
$(".row.even-odd-bg div label").each(
function(index,el)
{
$(el).prop("title",$(el).text());
}
);
$(".row.even-odd-bg div.three.columns label[data-value-type=ip]").mouseover(function(event)
{
var el=$(event.target);
if(el.data('ip-queried'))
return;
el.data('ip-queried',1);
if(location.protocol == 'https:')
{
url="https://ipapi.co/"+el.html()+"/json";
$.get(url,function(info)
{
var newVal=el.html()
+"<br>"+info.country_name
+"<br>"+info.region+"-"+info.city
+"<br>"+info.org
+"<br>"+info.asn;
el.html(newVal);
});
}
else
{
url="http://ip-api.com/json/"+el.html();
$.get(url,function(info)
{
var newVal=el.html()
+"<br>"+info.country
+"<br>"+info.regionName+"-"+info.city
+"<br>"+info.org
+"<br>"+info.as;
el.html(newVal);
});
}
return;
});
});
</script>
</div>
|
Download
