<html>
<head>
<title id="title"></title>

$(if refresh-timeout)
<meta http-equiv="refresh" content="$(refresh-timeout-secs)">
$(endif)

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;"/>

<link rel="stylesheet" href="css/desa-digital.css">
<link rel="icon" href="img/favicon.png" />

<style>
iframe{
    float:left;
    height:23px;
    width:100%;
}
</style>

<script language="JavaScript">
<!--

$(if advert-pending == 'yes')

var popup = '';

function focusAdvert() {
    if (window.focus) popup.focus();
}

function openAdvert() {
    popup = open('$(link-advert)', 'hotspot_advert', '');
    setTimeout("focusAdvert()", 1000);
}

$(endif)

function closeWindowOnly() {
    window.open('', '_self');
    window.close();
    return false;
}

//-->
</script>

</head>

<body

$(if advert-pending == 'yes')
onLoad="openAdvert()"
$(endif)

>

<div class="container">
<div class="row">

<div class="col-8 mr-a box-semua" id="main" style="float:none;">

<div class="row">

<div class="col-4">

<div class="card">

<div class="statuss">

$(if login-by == 'trial')

<h3 style="color:#7b7a7a;text-align:center;margin-top:15px;">
Welcome
</h3>

<div class="boxs" style="color:#ff2b31">
<h2>$(mac)</h2>
</div>

$(elif login-by != 'mac')

<h3 style="color:#7b7a7a;text-align:center;margin-top:15px;">
Welcome
</h3>

<div class="boxs" style="color:#ff2b31">
<h2 id="user">$(username)</h2>
</div>

$(elif login-by = 'mac')

<h3 style="color:#7b7a7a;text-align:center;margin-top:15px;">
Welcome
</h3>

<div class="boxs" style="color:#ff2b31">
<h2 id="user">$(mac)</h2>
</div>

$(endif)

<a class="a" id="cek" href="./detail.html"></a>

<form action="#" name="logout" onSubmit="return closeWindowOnly()">

<table class="table table-bordered table-hover mr-b-10">

<tr>
<td align="left">IP</td>
<td>$(ip)</td>
</tr>

<tr>
<td align="left">MAC</td>
<td>$(mac)</td>
</tr>

<tr>
<td align="left" style="width:35%;">Trafic</td>
<td>$(bytes-in-nice) | $(bytes-out-nice)</td>
</tr>

<tr>
<td align="left">Connected</td>
<td>$(uptime)</td>
</tr>

$(if remain-bytes-total)
<tr>
<td align="left">Remaining Data</td>
<td>$(remain-bytes-total-nice)</td>
</tr>
$(endif)

$(if session-time-left)
<tr>
<td align="left">Remaining Time</td>
<td>$(session-time-left)</td>
</tr>
$(endif)

$(if blocked == 'yes')

<tr>
<td align="left">Status</td>

<td>
<div style="color:#FF8080">

<a href="$(link-advert)" target="hotspot_advert">
advertisement
</a>

required

</div>
</td>

</tr>

$(elif refresh-timeout)

<tr>
<td align="left">Refresh</td>
<td>$(refresh-timeout)</td>
</tr>

<tr>
<td align="left">Expired</td>

<td style="padding-top:3px;padding-left:1px;">

<iframe
id="exp"
frameborder="0"
scrolling="no"
src="about:blank">
</iframe>

</td>

</tr>

$(endif)

</table>

$(if login-by-mac != 'yes')

<button type="submit" class="btn-md w-12 bg-login pd-5">
Close
</button>

$(endif)

</form>

</div>
</div>
</div>

<div class="col-8">

<div class="row">

<div class="carousel slide"
data-ride="carousel"
data-interval="3000">

<div class="carousel-inner">

<div class="carousel-item active">

<img
class="d-block w-100"
style="width:100%;max-width:607px;height:auto;"
src="img/secure1.png"
alt="First slide">

</div>

<div class="carousel-item">

<img
class="d-block w-100"
style="width:100%;max-width:607px;height:auto;"
src="img/secure2.png"
alt="Second slide">

</div>

<div class="carousel-item">

<img
class="d-block w-100"
style="width:100%;max-width:607px;height:auto;"
src="img/secure3.png"
alt="Third slide">

</div>

</div>
</div>
</div>

<div class="text-center text-grey" style="font-size:80%">
&copy; Copyright SS Telecom 2026 | All rights reserved
</div>

</div>
</div>
</div>
</div>
</div>

<script type="text/javascript">

document.getElementById('title').innerHTML =
window.location.hostname + " > status";

var usr = document.getElementById('user').innerHTML;

var url =
"https://hotspot.wifiapp.net/hotspot_gateway/status.php?name=";

document.getElementById('exp').src =
url + encodeURIComponent(usr);

</script>

<script src="js/slim.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>

</body>
</html>